【问题标题】:I got an error when i try to update data from firestore "FirebaseError: Function CollectionReference.doc()"当我尝试从 firestore “FirebaseError: Function CollectionReference.doc()”更新数据时出现错误
【发布时间】:2019-10-07 18:22:17
【问题描述】:

我正在创建一个小型反应本机应用程序,当我添加一些代码以更新来自 firebase 的一些数据时,它在控制台上向我显示此错误: “FirebaseError:函数 CollectionReference.doc() 要求其第一个参数为非空字符串类型,但它是:未定义”

我的行动准则:

const updateChat =(newChat)=>{ 

  return (dispatch)=>{    
    console.log("trying to update: ", newChat);
    console.log("trying to update and getting the id: ", newChat.id);
    firestore.firestore().collection("chat").doc(newChat.id)
     .update(
       {
         msg: newChat,
       }
      )
     .then(() =>{ 
       dispatch({
         type:'UPDATE_CHAT',  
       })  
      })
      .catch(function(error) {
        console.error("Error updating document: ", error);
    })
 }}

我的组件代码:

class SettingsScreen extends React.Component {
  static navigationOptions = {
    title: 'Chat Screen',
  };
   state = {
       id: "",
       chat_input: "",
       updated: false,
   }

   onNewChat = () => {

       this.props.addChat(
           this.state.chat_input
       )
       this.setState({
           chat_input: ""
       });
       Keyboard.dismiss();
   }

    handleUpdate  = (id, chat_input) => {
        this.setState(
            {
                id:id,
                chat_input: chat_input,
                updated: true,
            }
        )
    }
    saveUpdate=()=>{
        this.props.updateChat(this.state.chat_input)
        this.setState({
            chat_input: "",
            id: "",
       })  
     }

   renderItem = ( {item} ) => {
       return (
           <View style={styles.row}>
               <Text style={styles.message} >{item.msg}</Text>
               <TouchableOpacity
                    style={styles.button}
                    onPress={ () => {this.props.deleteChat(item.id)} }
                >
                  <Image
                    source={require('../assets/images/trash2.png')}
                    fadeDuration={0}
                    style={{width: 30, height: 30}}
                  />
                </TouchableOpacity>
                <TouchableOpacity
                    style={styles.buttonEdit}
                    onPress={ () => { this.handleUpdate(item.id, item.msg} }
                >
                  <Image
                    source={require('../assets/images/edit.png')}
                    fadeDuration={0}
                    style={{width: 30, height: 30}}
                  />
                </TouchableOpacity>
           </View>
       );
   }

  render() {
    const { thread } = this.props || []

       if (!thread) {
           return (
                <View style={styles.container}>
                    <Text>Loading...</Text>
                </View>
           )
       }
    return ( 
       <View style={styles.container}>
               <FlatList
                   data={thread}
                   renderItem={this.renderItem}
                   inverted
                   keyExtractor={(item, index) => index.toString()}  
               />
               <KeyboardAvoidingView behavior="padding">
                   <View style={styles.footer}>
                       <TextInput
                           value={this.state.chat_input}
                           onChangeText={text => this.setState({ chat_input: text })}
                           style={styles.input}
                           underlineColorAndroid="transparent"
                           placeholder="Type something nice"
                       />
                       <TouchableOpacity onPress={
                            this.state.updated
                                ? this.saveUpdate()
                                : this.onNewChat.bind(this)
                            }
                        >
                           <Text style={styles.send}>Send</Text>
                       </TouchableOpacity>
                   </View>
               </KeyboardAvoidingView>
           </View>
    );
  }
}
const mapStateToProps = (state) => {
 return {
   thread: state.firestore.ordered.chat 
 }
}

export default compose(
   connect(mapStateToProps, {addChat, deleteChat, updateChat}),
   firestoreConnect([
       { collection: 'chat'},
   ]))(SettingsScreen);

【问题讨论】:

    标签: reactjs firebase react-native google-cloud-firestore


    【解决方案1】:

    您没有将所有信息传递给您的 updateChat 操作。如下编辑

    saveUpdate=()=>{
        this.props.updateChat({
            chatInput: this.state.chat_input,
            id: this.state.id
        })
        this.setState({
            chat_input: "",
            id: "",
        })  
    }
    

    您还需要将更新参数更改为:

    firestore.firestore().collection("chat").doc(newChat.id)
        .update(
           {
              msg: newChat.chatInput,
           }
        )
    

    【讨论】: