使用Vuetify.js在代码中更新了v-model但在屏幕上没有更新

我有一个问题:我在一个叫 data 对象。contact_id, contact_child_id, address_id, address.

contact_idcontact_child_idaddress_id 变化的情况下 address 是更新的。

问题 如果我 console.log(data.address)虽说更新了,但显示的输入字段却没有更新。

我需要能够手动更改地址,添加一些信息,所以我不能使用计算属性。

模板。

    <v-autocomplete
                v-model="data.contact_id"
                :label="$tc('Contact')"
                :items="contact.items"
                :loading="contact.loading"
                :search-input.sync="contact.search"
                autofocus
                return-object
              ></v-autocomplete>

              <v-select
                v-model="data.contact_child_id"
                :items="child.items"
                :loading="child.loading"
                :placeholder="$tc('Contact')"
                return-object
                @change="updateAddress"
              >
                <template v-slot:item="data">
                  <template>
                    <v-list-item-content>
                      <v-list-item-title>{{data.item.name}}</v-list-item-title>
                      <v-list-item-subtitle>{{data.item.job}}</v-list-item-subtitle>
                    </v-list-item-content>
                  </template>
                </template>
              </v-select>

              <v-select
                v-model="data.address_id"
                :items="addressItems"
                :loading="addressLoading"
                return-object
                @change="updateAddress"
              >
                <template v-slot:item="data">
                  <template>
                    <v-list-item-content>
                      <v-list-item-title v-html="nl2br(formatAddress(data.item))"></v-list-item-title>
                    </v-list-item-content>
                  </template>
                </template>
              </v-select>
            </v-card-text>
            <v-card-text>
              <v-textarea
                v-model="data.address"
                auto-grow
                rows="1"
                :label="$tc('Address')"
              ></v-textarea>
            </v-card-text>

脚本

    function updateAddress() {
          data.value.address =
            (typeof data.value.contact_id == "object"
              ? data.value.contact_id.name
              : props.contactName) +
            (typeof data.value.contact_child_id == "object" &&
            data.value.contact_child_id.name
              ? "\n" + data.value.contact_child_id.name
              : "") +
            (typeof data.value.address_id == "object"
              ? "\n" + formatAddress(data.value.address_id)
              : "");
          console.log(data.value.address);
        }

console.log(data.value.address) 例如,印刷品 organization\ncontact name\naddress 但输入字段不显示变化。

解决方案:

你面临的是一个反应性的问题,如前所述 here 所以你应该使用 context.set(data.value,'address',theValue) :

setup(props,context){
...
 function updateAddress() {
          context.set(data.value,'address',
            (typeof data.value.contact_id == "object"
              ? data.value.contact_id.name
              : props.contactName) +
            (typeof data.value.contact_child_id == "object" &&
            data.value.contact_child_id.name
              ? "\n" + data.value.contact_child_id.name
              : "") +
            (typeof data.value.address_id == "object"
              ? "\n" + formatAddress(data.value.address_id)
              : ""));
          console.log(data.value.address);
        }

...
}


或破坏上下文如下:

setup(props,{$set, ...}){
...
 function updateAddress() {
         $set(data.value,'address'

给TA打赏
共{{data.count}}人
人已打赏
未分类

安卓。在回收器视图中点击图片按钮时,从Textview中传递文本。

2022-9-9 5:08:19

未分类

Rebol2View的问题。Rebol2的布局功能是如何工作的?

2022-9-9 5:08:21

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索