Vue 的資料繫結,資料操作

2021-08-22 11:30:36 字數 691 閱讀 6876

本人新學的vue,在專案後期進入,在修改乙個bug的時候,需要在input中設定必須為數字,且不能為負數。

input type= number,可以解決必須為數字

但是設定不能為負數的時候,出現了問題,因為input自帶的min 和max 在form表單外不生效了。而且input的值是v-model繫結的data,根據vue正常思路是去修改this.data,但是有很多資料,就要給每個資料都設定判斷,工作量太大。一直想找乙個公共的方法

vue

"tems_input textnumber"

min=

"1"type

="number" size=

"mini" @keyup.native=

"show('pingtime',$event)" v-model

="nei.pingtime"

/>

js

show(name,val) 

this.$set(this,name,value);

},

現在只需要每個輸入框繫結這個show方法,傳入引數即可

第乙個引數是資料的名稱,第二個引數是事件操作的物件

其中注意:$event必須放在後面,如果放在前面傳的引數不對,其中原因還是不清楚,$set 和$event需要深入研究下,研究好了在分享給大家。

vue 雙向繫結資料的原理

vue能做到雙向繫結資料靠的就是object.defineproperty 俗稱屬性 例如 平時我們定義乙個引數 是這樣的 var book console.log book.name 一般的引數 但是你想在輸出的同時對引數進行一些操作 var book var name object.define...

flex繫結資料

在使用flex開發的過程中,資料繫結是一定會遇到的,這種技術簡單,又有點好玩,重要的是它讓開發變得簡單了。在flex中,資料繫結的方式有這麼三種 示例1中的繫結方式即是第一種繫結方式,在 中直接填寫inputunit.text,表示label顯示的內容和textinput是關聯的,它會隨著texti...

HighChat動態繫結資料 資料後台繫結(三)

今天看了幾位大佬的部落格,學到了一些,現在分享一下,也作為以後的參考 不多說看 1.後台 public actionresult ajax2 reportdata.categories key double?value double?value1 reportitem ri1 new reporti...