小编Adi*_*ari的帖子

reCAPTCHA容器未找到或已包含内部元素

当我尝试进行手机验证时,我在角度4中收到错误.

我在控制台中遇到此错误

reCAPTCHA容器未找到或已包含内部元素!

我没有在网上看到reCAPTCHA容器,也无法按下它.

登录-page.ts

 import { Component, OnInit } from '@angular/core';
// tslint:disable-next-line:quotemark
import { Router } from "@angular/router";
// tslint:disable-next-line:quotemark
import { AuthService } from "../../core/auth.service";

import { ReactiveFormsModule } from '@angular/forms';
import * as firebase from 'firebase';


export class PhoneNumber {

  country: string;

  area: string;

  prefix: string;

  line: string;

  // format phone numbers as E.164

  get e164() {

    const num = this.country + this.area + this.prefix + this.line

    return `+${num}`

  }


}

@Component({
  // tslint:disable-next-line:component-selector
  selector: 'user-login', …
Run Code Online (Sandbox Code Playgroud)

authentication angularfire2 angular

7
推荐指数
1
解决办法
2692
查看次数

使用@HostBindings代替主角4

我只是尝试用角度4制作动画,我看到了在组件中使用主机的教程

import { Component, OnInit, HostBinding } from '@angular/core';
import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2';
import { Router } from '@angular/router';
 import { moveIn } from '../router.animations';

@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css'],
animations: [moveIn()],
host: {'[@moveIn]': ''}
})
Run Code Online (Sandbox Code Playgroud)

但它显示我在主机属性"[tslint]使用@hostBindings和@HostListeners而不是主机属性"下的错误

animation angular2-hostbinding angular

6
推荐指数
3
解决办法
4388
查看次数

将本机 2 种颜色反应为背景

我正在尝试使用 flex 制作 2 种颜色的背景,它似乎工作得很好,但我想在照片中制作中间的按钮,我需要在代码中插入按钮?我希望它是这样的:

在此处输入图片说明

     return (
            <View style={container}>
                <View style={leftContainer}>
                </View>
                <View style={rightContainer}>
                </View>
                <Button 
                    title="button"/>
            </View>
        )
    }
}


const styles = StyleSheet.create({
    container: {
        flex: 1,
        flexDirection:'row'

    },
    leftContainer:{
        flex:1,
        backgroundColor: '#ca8afa',    
    },
    rightContainer:{
        flex:1,
        backgroundColor: '#96d0e3'

    },
    addButton: {
      justifyContent: 'center',
      alignItems: 'center',
      position: 'absolute',
      bottom: 20,
      right: 20,
      zIndex: 1111,
      width: calcSize(192 / 2),
      height: calcSize(192 / 2)
    }
  }) 
Run Code Online (Sandbox Code Playgroud)

问题是按钮现在也在行中而不是在中间,我该如何解决?

react-native

6
推荐指数
1
解决办法
5102
查看次数

在后台运行推送通知以响应本机

我正在尝试使用此插件的react native实现推送通知 react-native-push-notifications。我成功的是在应用程序运行时(在前台)获得通知,但是我想要做的是在应用程序关闭(后台),未运行且收到通知进入应用程序时获得通知。

我的代码

 componentDidMount() {
    this.initEventPushNotification()
    this.initPushNotification()

}


initEventPushNotification() {
    AppState.addEventListener('change', (state) => {
        console.log(state)
        if (state === 'background') {
            PushNotification.popInitialNotification((notification) => {
                if (notification) {
                    this.onNotification(notification);
                }
            });
            PushNotification.setApplicationIconBadgeNumber(0);
        }
        if (state === 'active') {
            PushNotification.popInitialNotification((notification) => {
                if (notification) {
                    this.onNotification(notification);
                }
            })
        }


    });

}



initPushNotification() {
    console.log('init')
    PushNotification.configure({

        // (optional) Called when Token is generated (iOS and Android)
        onRegister: function (token) {
            AppStore.setFCMToken(token.token)
            FirebaseService.setTokenData(token.token)
        },

        // (required) Called when a remote or …
Run Code Online (Sandbox Code Playgroud)

android push-notification firebase react-native firebase-cloud-messaging

6
推荐指数
1
解决办法
1万
查看次数

react-navigation 3在嵌套堆栈中重置

我试着理解如何在嵌套堆栈中重置我的代码

    const AuthStack = createStackNavigator(
      {
        Welcome,
        Login,
        Register,
        ConfirmationCode,
      },
      {
        initialRouteName: 'Welcome',
        headerMode: 'none',
        lazy: true,
        transitionConfig,
        defaultNavigationOptions: {
          gesturesEnabled: false,
        },
      }
    )

    const AppStack = createStackNavigator(
      {
        TabStack,
        SearchResult,
        BusinessDetail,
        BusinessMap,
        MakeAppointment,
        TermsAndConditions
      },
      {
        initialRouteName: 'TabStack',
        headerMode: 'none',
        lazy: true,
        transitionConfig,
        defaultNavigationOptions: {
          gesturesEnabled: false,
        },
      }
    )

    let MainStack = createSwitchNavigator(
      {
        AuthLoading,
        Auth: AuthStack,
        App: AppStack,
      },
      {
        initialRouteName: 'AuthLoading',
        headerMode: 'none',
        lazy: true,

        defaultNavigationOptions: {
          gesturesEnabled: false,
        },
      }
    )
Run Code Online (Sandbox Code Playgroud)

TabStack

    import …
Run Code Online (Sandbox Code Playgroud)

react-native react-native-navigation react-navigation

6
推荐指数
1
解决办法
1996
查看次数

Firebase Auth SMS 验证码用于创建电话身份验证

我使用firebase构建react native,并使用插件react-native-firebase。我实现了 firebase auth 电话,当我将短信代码发送到我的手机时,我得到了 2 个错误:

  1. 当我输入正确的短信代码时出现错误

用于创建手机认证凭证的短信验证码无效。请重新发送验证码短信

  1. 当我重新加载应用程序然后想再次输入代码时,我收到错误

短信代码已过期。请重新发送验证码重试

我该如何解决这些问题?另外,有内置发送重发短信吗?

那是我的代码

confirmPhone = async (phoneNumber) => {
    return new Promise((res, rej) => {
        firebase.auth().verifyPhoneNumber(phoneNumber)
            .on('state_changed', async (phoneAuthSnapshot) => {
                switch (phoneAuthSnapshot.state) {
                case firebase.auth.PhoneAuthState.AUTO_VERIFIED:
                    await this.confirmCode(phoneAuthSnapshot.verificationId, phoneAuthSnapshot.code, phoneAuthSnapshot)
                    res(phoneAuthSnapshot)

                    break

                case firebase.auth.PhoneAuthState.CODE_SENT:
                    // await userSettings.set(AUTH_KEYS.VERIFICATION_ID, phoneAuthSnapshot.verificationId)
                    UserStore.setVerificationId(phoneAuthSnapshot.verificationId)
                    res(phoneAuthSnapshot)
                    break

                case firebase.auth.PhoneAuthState.AUTO_VERIFY_TIMEOUT: // or 'timeout'
                    UserStore.setVerificationId(phoneAuthSnapshot.verificationId)
                    res(phoneAuthSnapshot)


                case firebase.auth.PhoneAuthState.ERROR:
                    UserStore.setErrorConfirmationCode(phoneAuthSnapshot.error)
                    rej(phoneAuthSnapshot)
                    break

                }
            })
    })
}

confirmCode = async (verificationId, code, phoneAuthSnapshot) => {
    UserStore.setCodeInput(code)
    try{
        const credential = …
Run Code Online (Sandbox Code Playgroud)

firebase firebase-authentication

5
推荐指数
0
解决办法
1903
查看次数

firebase统计在线用户并在全球柜台更新

我想计算firebase中的在线用户并将值存储在online_users下的firebase中,当用户连接到app以增加online_users并且当用户从app断开连接到减量时.我建立了firebase功能

export const countOnlineUser = functions.database
.ref('/UserStatus/{uid}')
.onWrite((change, context) => {
    var collectionRef = change.after.ref.parent;
    var countRef = collectionRef.child('online_users');

    let increment = 0;
    if (change.after.exists() && !change.before.exists()) {
        increment = 1;
    } else if (!change.after.exists() && change.before.exists()) {
        increment = -1;
    } else {
        return null;
    }

    // Return the promise from countRef.transaction() so our function
    // waits for this async event to complete before it exits.
    return countRef.transaction((current) => {
         console.log(current)
        if (current == null) {
            return 0;
        } …
Run Code Online (Sandbox Code Playgroud)

node.js firebase firebase-realtime-database google-cloud-functions

5
推荐指数
1
解决办法
641
查看次数

babel 7不允许在装饰器和类之间使用export关键字。请改用`export @dec class`

我正在将React js与最新的babel 7一起使用,当我使用mobx的装饰器时出现错误

解析错误:不允许在装饰器和类之间使用export关键字。请export @dec class改用。

我的代码

import React, { Component } from 'react';
import { observer,inject } from 'mobx-react'


import './style.scss'


@inject('routingStore', 'UserStore')
@observer
export default class Login extends Component {
    constructor(props) {
        super(props)
        this.state = {

        }
    }


    render() {

        return (
            <div>
                <h1>Login</h1>
            </div>
        )
    }
}
Run Code Online (Sandbox Code Playgroud)

package.json

    {
  "name": "admin-managment-barber",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@babel/core": "7.1.0",
    "@svgr/webpack": "2.4.1",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "9.0.0",
    "babel-jest": "23.6.0",
    "babel-loader": "8.0.4",
    "babel-plugin-named-asset-import": "^0.2.3",
    "babel-preset-react-app": "^6.1.0",
    "bfj": "6.1.1", …
Run Code Online (Sandbox Code Playgroud)

babel reactjs

5
推荐指数
2
解决办法
3182
查看次数

通过 GitHub API 获取 Git 标签中的所有提交仅返回第一个提交

我正在尝试将 git 标签中的所有提交都扔到 github api 中。我检查了这个堆栈溢出问题 ,但通过这种方式,它要求我比较两个标签,并且它只返回第一次提交。我想获取特定标签的所有提交。我用的是

https://api.github.com/repos/:org/:repo/compare/:tag_1...:tag_2
Run Code Online (Sandbox Code Playgroud)

因为我想要特定的标签,所以我添加了相同的标签

https://api.github.com/repos/xxxx/ant-design/compare/3.13.2...3.13.2
Run Code Online (Sandbox Code Playgroud)

它返回给我仅有的 2 个提交,但在标签中我有很多提交,如您在此处看到的。 在此输入图像描述

github github-api

5
推荐指数
1
解决办法
1824
查看次数

具有自动完成功能的 Formik 材料 ui 无法按预期工作

我使用formikMaterial-ui来构建自定义自动完成组件。

我的代码链接

我使用yup添加验证以要求自动完成(用户需要选择一个选项):

 validationSchema: Yup.object().shape({
      skill: Yup.object().shape({
        value: Yup.string().required(),
        label: Yup.string().required()
      })
    }),
Run Code Online (Sandbox Code Playgroud)

当用户选择任何选项时,我希望它将选项保存为 {label,value} 而不仅仅是值,因为这样我需要将其作为对象发送到服务器。

我收到一些错误:

  1. 当我按提交时出现错误

    Objects are not valid as a React child (found: object with keys {value, label}). If you meant to render a collection of children, use an array instead.

  2. 我收到这些警告:

    MUI:提供给自动完成的值无效。没有一个选项与 `{"label":"","value":""}` 匹配。您可以使用“isOptionEqualToValue”属性来自定义相等测试。

    警告:道具类型失败:向“ForwardRef(TextField)”提供的道具“helperText”无效,需要 ReactNode。

我正在尝试构建可重用的自动完成组件,以便能够将选定的值作为 {label,value} 获取,而不会出现任何错误并按预期工作。我不确定我的验证方法是否正确。我只想让用户选择一个选项。

另外,我想问一下,我可以将对象详细信息存储到值中而不是字符串中吗?如果不是,存储对象值作为选项的最佳方式是什么?

我的 yup 模式是正确的方法吗?我应该将对象的 id 存储为值然后对其进行过滤吗?如何将值作为字符串传递给自动完成并显示在自动完成中选择的值?如果没有技能模式作为对象,我该如何做到这一点,就像字符串一样:

 validationSchema: Yup.object().shape({
  skill: Yup.string().required()
}),
Run Code Online (Sandbox Code Playgroud)

reactjs material-ui yup formik

5
推荐指数
1
解决办法
1170
查看次数