Question

我在React Native中按照我想要的方式重新开始工作时遇到了一些麻烦......

我希望能够做到以下几点：

render() {
  ...
  <InputDBSync root={"foo/Hello word"} node="bar" />
  <InputDBSync root={"foo/Hello word"} node="baz" />
  ...
}

如果firebase实例不存在，它应该创建（发布）它

hello world
  foo
    bar: ''
    baz: ''

这是我的代码

import React, { Component } from 'react'
import { View } from 'react-native'
import { InputGroup, Input, Icon, Text} from 'native-base'
import DB from './DB'

export default class InputDBSync extends Component {
  constructor(props){
    super(props)
    this.state = {
      value: ""
    }
    this.syncDB = this.syncDB.bind(this)
  }

  syncDB() {
    const path = `${this.props.root}/${this.props.node}`
    this.ref = DB.syncState(
      path,
      { context: this,
        state: 'value' }
    )
  }

  componentDidMount(){
    const path = `${this.props.root}/${this.props.node}`
    DB.fetch(path, { context:this })
    .then( fetchdata => {
      if (fetchdata == null) {
        DB.post( path,
          { data: this.state.value } )
          .then( this.syncDB )
      } else {
        this.syncDB
      }})
    .catch( error => console.error(error))
  }

  componentWillUnmount(){
    DB.removeBinding(this.ref);
  }

  render () {
    return (
      <View>
        <InputGroup borderType='underline'>
          <Icon name="ios-beer-outline" />
          <Input
            value={this.state.value}
            onChangeText={text => {
              const copyState = {...this.state}
              copyState.value = text
              this.setState({ ...copyState })
            }}
            placeholder="Cheers"
          />
        </InputGroup>
      </View>
    )
  }
}

它没有用空值创建它..但是连接到它。所以，一旦我输入＆＃34;嗨＆＃34;进入巴兹它变成：

hello world
  foo
    baz: 'Hi'

重新发帖不发帖

0 个答案: