React native <；文本>；标记未在React native中显示值 导出默认类应用程序扩展组件{ 状态={ 地名：“”， 案文：[]， } changeName=（值）=>{ 这是我的国家({ 地名：value }) } addText=（）=>{ 如果（this.state.placeName.trim==“”）{ 返回； } 否则{ this.setState（prevState=>{ 返回{ text:prevState.text.concat（prevState.placeName） }; }) } } render（）{ const Display=this.state.text.map（（placeOutput，i）=>{ {placeOutput} }) 返回( {Display} ); } } const styles=StyleSheet.create({ 容器：{ 弹性：1， 填充：20， justifyContent:“flex start”， 对齐项目：“居中”， 背景颜色：“#F5FCFF”， }, 输入文本：{ 边界宽度：2， 边框底部颜色：“黑色”， 宽度：“70%”， }, 输入按钮：{ 宽度：“30%”， }, 输入容器：{ 宽度：“100%”， flexDirection:'行'， justifyContent:'之间的空间'， 对齐项目：“中心” }, 欢迎:{ 尺寸：20， textAlign:'中心'， 差额：10， }, 说明：{ textAlign:'中心'， 颜色：'#333333'， marginBottom:5， }, });

我有一个文本输入和按钮。 当我写东西并按下回车按钮时，我希望我输入的文本显示在下面，但没有显示任何内容。 我不知道…映射函数不起作用？？？

var Display=this.state.text.map（（placeOutput，i）=>{
export default class App extends Component {    

  state = {
    placeName: '',
    text:[],
  }



  changeName = (value) => {
    this.setState({
      placeName: value
    })
  }



  addText = () => {

    if (this.state.placeName.trim === "") {

      return;

    }

    else {

      this.setState(prevState => {

        return {

          text: prevState.text.concat(prevState.placeName)

        };

      })

    }

  }

  render() {

    const Display = this.state.text.map((placeOutput,i) => {
      <Text key={i}>{placeOutput}</Text>
    })

    return (

      <View style={styles.container}>
        <View style={styles.inputContainer}>
          <TextInput style={styles.inputText}
            value={this.state.placeName}
            placeholder="Awesome text here"
            onChangeText={this.changeName} />
          <Button title="Send" style={styles.inputButton}
            onPress={this.addText} />
        </View>
       <View>{Display}</View>
      </View>

    );
  }
}

const styles = StyleSheet.create({

  container: {
    flex: 1,
    padding: 20,
    justifyContent: 'flex-start',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },

  inputText: {
    borderBottomWidth: 2,
    borderBottomColor: "black",
    width: "70%",
  },

  inputButton: {
    width: "30%",
  },

  inputContainer: {
    width: "100%",
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: "center"
  },

  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },

  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

返回(
{placeOutput}）
})

---

您正在使用return吗？

您忘记了

返回
映射
方法中的文本组件：

 var Display = this.state.text.map((placeOutput,i) => {
return (
      <Text key={i}>{placeOutput}</Text>)
    })

render（）{
const Display=this.state.text.map（（placeOutput，i）=>{
返回(
{placeOutput}
)
})
...
}
请向我们展示{Display}componentconst Display=this.state.text.map（（placeOutput，i）=>{{placeOutput}）它在上面的代码中。我认为它是一行，所以它会自动返回。
render() {
  const Display = this.state.text.map((placeOutput, i) => {
    return (
      <Text key={i}>{placeOutput}</Text>
    )
  })

  ...
}