Vue.js 3 替换更新react性对象而不会失go react性

发布于01月15日

我需要在获取后使用一些数据更新react 对象:

  setup(){
    const formData = reactive({})

    onMounted(() => {
      fetchData().then((data) => {
        if (data) {
          formData = data //how can i replace the whole reactive object?
        }
      })
    })
  }

formData = data也不行

有更好的方法吗？

推荐答案

reactive应该定义一个具有嵌套字段的状态，这些字段可能会发生如下变化:

 setup(){
    const data= reactive({formData :null })

    onMounted(() => {
      fetchData().then((data) => {
        if (data) {
          data.formData = data 
        }
      })
    })

  }

如果只有一个嵌套字段，则使用ref:

  setup(){
    const formData = ref({})

    onMounted(() => {
      fetchData().then((data) => {
        if (data) {
          formData.value = data 
        }
      })
    })

  }