0

我似乎破坏了我的对象的反应性，并且 v-if 不起作用。我的数组是Parse Objects的数组，需要我使用它.get()来获取值，它正在处理标题、描述等的初始加载。加载数据后，我检查所有内容并使用 更新一些值.set()，但它们在我硬刷新整个 Nativescript 视图之前不要更新视图，这当然不是一个合适的解决方案。

本机脚本

<ListView for="(item, index) in challenges" @itemTap="onItemTap(item)">
  <v-template>
   ....
    <GridLayout rows="auto" columns="*" >
     <Button v-if="item.get('joined')" text="0%" row="0" horizontalAlignment="right" class="challenge-button" @tap="onButtonTap()" />
     <Button v-else text="Meedoen" row="0" horizontalAlignment="right" class="challenge-button" @tap="joinChallengeButton(item, index)" />
    </GridLayout>
  ....
  </v-template>

Vue

@Component
export default class Challenges extends Vue {
  challenges: Parse.Object[] = []

  async joinChallengeButton(item, index) {
    item.set("joined", true)
  }
}

解析对象

{
"title": "title x",
"description": "description x",
"createdAt": "2021-05-29T11:32:25.991Z",
"updatedAt": "2021-05-29T12:32:33.133Z",
"startDate": {
"__type": "Date",
"iso": "2021-05-19T11:32:00.000Z"
},
"endDate": {
"__type": "Date",
"iso": "2021-06-19T11:32:00.000Z"
},
"image": {
"__type": "File",
"name": "d8684be38017585079cfdb4380b4d9d4_sleep.jpeg",
"url": "xxxxx.com"
},
"joined": true,
"objectId": "AUJ4Y7XNcp"
}

更新 1： 如果我以 Vue 方式更新数组，它会破坏 nativescript 视图并刷新并仅显示该项目，而不是完整列表。

    this.$set(this.challenges, index, item)
4

1 回答 1

1

如果找到答案。该对象正在使用 vue 方法进行更新this.$set(this.challenges, index, item)，但之后列表视图未显示正确的高度。所以所有的新对象都是隐藏的行。

于 2021-05-31T13:58:09.290 回答