React Native，值没有更新

Question

我制作了一个编辑屏幕，并尝试使用 getParams 和设置 setParams 通过导航 v4 更新帖子的值，但是当我更改旧值并单击保存按钮保存它时，它没有更新它，也没有显示任何错误。它仍然显示旧值。有人可以帮我吗，下面是我的代码

EditScreen.js

class EditScreen extends Component {

  render() {

    const { params } = this.props.navigation.state;

    return (

      <KeyboardAvoidingView

        behavior="position"

        keyboardVerticalOffset={Platform.OS === "ios" ? 0 : 100}

      >

        <Image

          style={styles.image}

          source={this.props.navigation.getParam("image")}

        />

        <View style={styles.detailContainer}>

          <AppTextInput

            value={this.props.navigation.getParam("title")}

            onChangeText={(text) =>

              this.props.navigation.setParams({ title: text })

            }

          />

          <AppTextInput

            value={this.props.navigation.getParam("des")}

            onChangeText={(text) =>

              this.props.navigation.setParams({ des: text })

            }

          />

        </View>

        <AppButton

          text="Save"

          style={styles.button}

          onPress={() => {

            this.props.navigation.getParam("onEdit");

            this.props.navigation.goBack();

          }}

        />

      </KeyboardAvoidingView>

首页.js

class Home extends Component {

  state = {

    modal: false,

    post: [

      {

        key: "1",

        title: "A Good Boi",

        des: "He's a good boi and every one know it.",

        image: require("../assets/dog.jpg"),

      },

      {

        key: "2",

        title: "John Cena",

        des: "As you can see, You can't see me!",

        image: require("../assets/cena.jpg"),

      },

    ],

  };

  onEdit = (data) => {

    const newPosts = this.state.post.map((item) => {

      if (item.key === data.key) return data;

      else return item;

    });

    this.setState({ post: newPosts, editMode: false });

  };

Answer 1

我建议您将数据保持在组件状态：constructor(props) {&nbsp;super(props);&nbsp;// get the data that you need from navigation params&nbsp;const { key, title, ..} = this.props.navigation.state.params&nbsp;this.state = {key, title, ..}}然后 ：&nbsp; <AppTextInput&nbsp; &nbsp; value={this.state.title}&nbsp; &nbsp; onChangeText={(text) =>&nbsp; &nbsp; &nbsp; this.setState({ title: text })&nbsp; &nbsp; }&nbsp; />&nbsp; &nbsp; <AppButton&nbsp; &nbsp; &nbsp; text="Save"&nbsp; &nbsp; &nbsp; style={styles.button}&nbsp; &nbsp; &nbsp; onPress={() => {&nbsp; &nbsp; &nbsp; &nbsp; this.props.navigation.getParam("onEdit")(this.state);&nbsp; &nbsp; &nbsp; &nbsp; this.props.navigation.goBack();&nbsp; &nbsp; &nbsp; }}&nbsp; &nbsp; />

Answer 2

也许试试这个：<AppButton&nbsp; &nbsp; text="Save"&nbsp; &nbsp; style={styles.button}&nbsp; &nbsp; onPress={() => {&nbsp; &nbsp; &nbsp; &nbsp; this.props.navigation.getParam("onEdit")(this.props.navigation.state.params);&nbsp; &nbsp; &nbsp; &nbsp; this.props.navigation.goBack();&nbsp; &nbsp; }}/>和：this.props.navigation.navigate("Edit", {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; key: item.key,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; image: item.image,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; title: item.title,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; des: item.des,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onEdit: this.onEdit,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })