<Text> 标记未在 React 本机中显示值

Question

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,
  },
});

我有一个文本输入和按钮。当我写东西并按 Enter 按钮时，我希望我输入的文本显示在下面，但没有显示任何内容。我不知道。。。地图功能不起作用???

Answer 1

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

你用的是退货吗？

Answer 2

您忘记return map方法中的文本组件：

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