vue에서 요청한 데이터 중 특정 항목의 값을 변경하는 방법

아래에서는 Vue에서 요청한 데이터의 특정 값을 변경하는 방법(자세한 설명)을 공유하겠습니다. 좋은 참고 값이 있어 모든 분들께 도움이 되길 바랍니다.

JavaScript 제한으로 인해 Vue는 다음과 같은 변경된 배열을 감지할 수 없습니다.

인덱스를 사용하여 항목을 직접 설정하는 경우(예: vm.items[indexOfItem] = newValue

배열, 예: vm.items.length = newLength

In

<template>
 <p>
  <ul>
   <li v-for = " (item,index) in list" v-text=&#39;`${item} - ${index} `&#39;></li>
  </ul>
  <button @click="change3">改变数组第2个值,改成0</button>
  <button @click="change4">改变数组第2个值,改成5</button>
 </p>
</template>
<script>
import Vue from &#39;vue&#39;
export default {
 data () { 
  return {
   list : [ 1, 2, 3, 4],
   list2 : [ 7, 8, 9, 0 ]
  }
 },
 methods : {
  //通过下标来改变整个数组里的值也是行不通的
  changeList () {
   this.list[2] = 3
  },
  //通过数组长度改变改个数组里的值是行不通的
  changeList2 () {
   this.length = 1
  },
  //第一我们可以通过，vue.set实列方法来改变，但我们要在开头再引一入下vue包
  // 1 第一个值代表需要改变的数组
  // 2 第二个代表改变那一项
  // 3 第三个代表改成什么值
  //样式语法 Vue.set(example1.items, indexOfItem, newValue)
  change3 () {
   Vue.set(this.list,1,0)
  },
  //通过 Array.prototype.splice 数组原型上的方法来改变整个数组的长度或者内容
  //这个方法大家肯定常用，我就不细说了
  change4 () {
   this.list.splice(1,1,5)
  }
 }
}
</script>

운영상의 문제로 인해 코드에 직접 주석을 작성하여 이를 통해 배열의 길이를 변경하는 방법을 모든 사람이 명확하게 이해할 수 있도록 했습니다. 메소드. 아래첨자의 요소입니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

React에서 이벤트를 바인딩하는 네 가지 방법에 대한 자세한 설명

vue + vuex를 사용하여 todolist 구현(자세한 튜토리얼)

vue를 사용하여 목록에 나열하는 방법 구현 table , 각 행의 ID 가져오기(자세한 튜토리얼)

위 내용은 vue에서 요청한 데이터 중 특정 항목의 값을 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!