陣列採用賦值新增元素和push新增元素的區別
最近做專案時(vue2.0)遇到此坑耗費不少時間,分享如下:
data中定義初始結構:
data:function(){
return {
optionsArr: [{name: '', edit: false}],
}
}
script中:
for (let i = 0; i < this.flow.dicts.length; i++) {
this.optionsArr[i] = {name: this.flow.dicts[i].label, edit: false}
}
console.log(this.optionsArr)
修改為:
for (let i = 0; i < this.flow.dicts.length; i++) {
//即採用push去新增元素
this.optionsArr.push({name: that.flow.dicts[i].label, edit: false})
}
console.log(this.optionsArr)
template中:
想通過點選事件改變edit為true
<li v-for="(option,index) in optionsArr">
<span v-show="!option.edit" v-on:click ="option.edit = !option.edit">{{option.name}}</span>
</li>
用這兩種方法,optionsArr最後都是長度為二的陣列,但是push新增的元素具有set和get方法,這樣想通過點選改變edit值時可以生效的,而直接賦值新增的元素點選改變edit不生效,在vue的點選事件改變某屬性時這是需要特別注意的問題。
相關推薦
陣列採用賦值新增元素和push新增元素的區別
最近做專案時(vue2.0)遇到此坑耗費不少時間,分享如下: data中定義初始結構: data:function(){ return { optionsArr: [{name: '', edit: false}], } }
ES6 物件解構賦值和陣列結構賦值
1、解構物件 1.1、解構單層物件 1.1.1、解構單層物件——不賦值 let data = { id: 1, name: 'Jack' } let { id, name } = data
java小程式——給陣列隨機賦值,查詢輸入的值以及冒泡和選擇排序陣列並輸出
import java.util.Random; import java.util.Scanner; public class Test1{ public static void main(String[] args) { Scanner sc=new Scanner(Sy
字串在指標和陣列上賦值的區別
1 #include<stdio.h> 2 int main() 3 { 4 char *str1 = "abcde";// 字串常量 5 char str2[] = "abcde";// 字元陣列 6 str1[0] = 'x';/
html5中新增的元素和廢除的元素
內容 程序 包含 idt nav 表示圖 control figure 進行 一、新增的結構元素 1、section元素表示頁面中的一個內容區塊,比如章節、頁眉、頁腳或頁面中的其他部分。它可以與h1、h2、h3、h4、h5、h6等元素結合起來使用,標示文檔結構。 h
賦值運算符和比較運算符
賦值 比較 技術 什麽 否則 浪費 代碼 lse 運算符和 這裏為什麽把這兩個合起來呢? 因為這兩個東西太簡單了, 一篇一篇寫有點浪費,所以就合起來一起寫了 嗯 第一個.賦值運算符 賦值運算符一個有六個: =,+=,–=,*=,/=,%= 廢話少說,上圖: 運行結果
php 陣列 引用賦值 陣列指標的幾個函式 遍歷陣列
1. 複製一個數組,就是把一個數組賦值給一個變數便可。會把陣列指標位置一同複製。這裡面有兩種情況。一,指標位置合法,這時直接複製,無影響。二,原陣列指標位置非法時,“新”陣列指標會初始化。(這裡的新字為什麼要加引號?請看下文)先看例子: 出現這種情
【opencv 原始碼剖析】 四、 Mat的賦值建構函式 和 拷貝建構函式
1.賦值建構函式 右值引用 inline Mat& Mat::operator = (Mat&& m) { if (this == &m) return *this; release(); flags = m.fl
PLC 初學三通道點雲的賦值、顯示和儲存
#include <pcl/visualization/cloud_viewer.h> #include <iostream> #include <fstream> #include <pcl/io/io.h> #include
“全棧2019”Java第十七章:賦值運算符和算術運算符
技術 intel 難度 允許 更多 https 同步 com 運算符 難度 初級 學習時間 10分鐘 適合人群 零基礎 開發語言 Java 開發環境 JDK v11 IntelliJ IDEA v2018.3 文章原文鏈接 “全棧2019”Java第十七章:賦值運算符和
python 二維列表(陣列)賦值問題
當我們使用arr = [[0]*5]*5 初始化一個二維陣列時,會得到一個5*5的陣列, In [1]: arr = [[0]*5]*5 In [2]: arr Out[2]: [[0, 0, 0,
微信小程式陣列動態賦值
作為一個小白,最近有興趣試了試小程式開發,發現小程式裡面寫js和寫網頁的JavaScript還是有些不同的。 emmm,賦值真的有些坑。 首先是賦值後,如果要渲染到前端,一定要用that.setData({ }),否則改了也是木有用滴。 然後就是對陣列的賦值,直接在setData裡面是不
Python中的賦值、引用和深淺拷貝
全域性變數 在函式之外建立的變數屬於__main__,又被稱為全域性變數。它們可以在__main__中的任意函式中訪問,與區域性變數在函式結束時消失不同,全域性變數可以在不同函式的呼叫之間持久存在。全域性變數常常用作標誌(Flags)。標誌是一種布林型變數,可以
求解:微信小程式的setData陣列動態賦值
資料編寫在utils目錄下的util裡面: function getGoods(){ var goods = new Array(); var good = new Object(); good.id = '1000';//商品唯一識別符號 good.pic =
整型陣列整體賦值。
整型陣列無法整體賦值的原因: 對於一些特定的問題,整型陣列可能需要整體賦一個初值,但是缺乏直接賦值的函式,因為整型陣列沒有終結的標誌,計算機系統不會自動的判定它的大小,無法快速賦值。 整型陣列賦初值的方法: 1./<string.h> 中有memse
HTML5之新增的元素和廢除的元素 (宣告:內容節選自《HTML 5從入門到精通》)
section元素 section元素定義文件或應用程式中的一個區段,比如章節、頁首、頁尾或文件中的其他部分。它可以與h1,h2,h3,h4,h5,h6元素結合起來使用,標示文件結構。 HTML5中程式碼示例:<section>…</section> HTML4中程式碼示例:<
C++ Char陣列的賦值
1、定義的時候直接用字串賦值char a[10]="hello"; //sizeof(a)為10或char a[]="hello"; //sizeof(a)為6注意:不能先定義再給它賦值,如char a[10]; a[10]="hello";這樣是錯誤的!2、對陣列中
C字元陣列的賦值
strcmp函式是比較兩個字串的大小,返回比較的結果。一般形式是: i=strcmp(字串,字串); 其中,字串1、字串2均可為字串常量或變數;i 是用於存放比較結果的整型變數。比較結果是這樣規定的: ①字串1小於字串2,st
陣列的賦值
前段時間發現,將 array a 賦值給 array b之後,改變 array b後,array a也會跟著變化,一開始有些不解,後來才知道這是陣列為引用型別造成的。原理:當我們將 陣列a賦值給陣列b的過程中,其實是將陣列a的引用地址指向b,這個時候,陣列a和陣列b都指向同一
VBA Range與陣列互相賦值
Sub test() 'Range賦值給陣列(利用Application.WorksheetFunction.Transpose) ' Dim myData ' myData = Application.WorksheetFunction.Transpose(Rang