Vue 動態數據綁定核心方法

Kyxy 發布于2019-08-20 14:35 / 3245人閱讀

摘要：返回值返回傳入函數的對象，即第一個參數。描述該方法允許精確添加或修改對象的屬性。數據描述符同時具有以下可選鍵值該屬性對應的值。該方法返回值被用作屬性值。該方法將接受唯一參數，并將該參數的新值分配給該屬性。

引言

我之前經常使用 Vue，后來不滿足于僅僅使用它，我想了解其內部實現原理，所以就嘗試學習其源碼，獲益匪淺。所以，如果你跟我一樣，希望挑戰這高難度的事情，那就開啟這一系列吧！

基本上 MVVM 數據雙向綁定的框架大都采用了大量的 Object.defineProperty 來實現。

Object.defineProperty 語法

Object.defineProperty(obj, prop, descriptor)

參數:

obj

??????需要定義屬性的對象。

prop

??????需定義或修改的屬性的名字。

descriptor

??????將被定義或修改的屬性的描述符。

返回值

??????返回傳入函數的對象，即第一個參數obj。

描述

該方法允許精確添加或修改對象的屬性。一般情況下，我們為對象添加屬性是通過賦值來創建并顯示在屬性枚舉中（for...in 或 Object.keys 方法），但這種方式添加的屬性值可以被改變，也可以被刪除。而使用 Object.defineProperty() 則允許改變這些額外細節的默認設置。例如，默認情況下，使用 Object.defineProperty() 增加的屬性值是不可改變的。

對象里目前存在的__屬性描述符__有兩種主要形式：數據描述符和存取描述符。數據描述符是一個擁有可寫或不可寫值的屬性。存取描述符是由一對 getter-setter 函數功能來描述的屬性。描述符必須是兩種形式之一；不能同時是兩者。

數據描述符和存取描述符均具有以下可選鍵值：

configurable

??????當且僅當該屬性的 configurable 為 true 時，該屬性描述符才能夠被改變，也能夠被刪除。默認為 false。

enumerable

??????當且僅當該屬性的 enumerable 為 true 時，該屬性才能夠出現在對象的枚舉屬性中。默認為 false。

數據描述符同時具有以下可選鍵值：

value

??????該屬性對應的值。可以是任何有效的 JavaScript 值（數值，對象，函數等）。默認為 undefined。

writable

??????當且僅當該屬性的 writable 為 true 時，該屬性才能被賦值運算符改變。默認為 false。

存取描述符同時具有以下可選鍵值：

get

??????一個給屬性提供 getter 的方法，如果沒有 getter 則為 undefined。該方法返回值被用作屬性值。默認為 undefined。

set

??????一個給屬性提供 setter 的方法，如果沒有 setter 則為 undefined。該方法將接受唯一參數，并將該參數的新值分配給該屬性。默認為 undefined。

GPU云服務器云服務器 django vue 數據綁定 vue綁定 js動態綁定數據 vue綁定內聯樣式

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81760.html

VUE

摘要：注意指令前面需要加，對指令傳遞數據賦值使用例如約定速成加上，表示自定義指令不要使用駝峰式命名。需要通過方法實現自定義指令注冊完成。 vue Vue.js 構建數據驅動的web界面庫。集中實現MVVM 的 VM層。容易與其他庫或項目整合通過盡可能簡單的API實現相應的數據綁定和組合的視圖組件核心：相應的數據綁定系統，數據與DOM保持同步數據驅動的視圖，普通的HTML模板中使用特殊的語...

bergwhite 2019-08-19 18:39 評論0 收藏0
Vue_Vue權威指南

摘要：效率不高，很多多余，稱之為臟檢查。通過索引設置數組元素并觸發視圖更新。解決閃爍問題自定義指令自定義指令提供一種機制將數據的變化映射為行為。 Vue特性 Vue只是聚焦視圖層，是一個構建數據驅動的Web界面的庫。 Vue通過簡單 API提供高效的數據綁定和靈活的組件系統輕量數據綁定指令插件化架構從傳統后臺MVC 向REST API + 前端MV*遷移DOM是數據的一種自然映...

SimonMa 2019-08-21 14:31 評論0 收藏0
vue面試

摘要：雖然計算屬性在大多數情況下更合適，但有時也需要一個自定義的偵聽器，當需要在數據變化時執行異步或開銷較大的操作時，通過偵聽器最有用。路由的鉤子函數首頁可以控制導航跳轉，，等，一般用于頁面的修改。談談你對MVVM開發模式的理解 MVVM分為Model、View、ViewModel三者。Model 代表數據模型，數據和業務邏輯都在Model層中定義；View 代表UI視圖，負責數據的展示；...

vspiders 2019-08-23 18:38 評論0 收藏0
詳解vue組件三大核心概念

摘要：前言本文主要介紹屬性事件和插槽這三個基礎概念使用方法及其容易被忽略的一些重要細節。至于如何改變，我們接下去詳細介紹單向數據流這個概念出現在組件通信。比如上例中在子組件中修改父組件傳遞過來的數組從而改變父組件的狀態。的一個核心思想是數據驅動。前言本文主要介紹屬性、事件和插槽這三個vue基礎概念、使用方法及其容易被忽略的一些重要細節。如果你閱讀別人寫的組件，也可以從這三個部分展開，它們...

rickchen 2019-08-23 17:51 評論0 收藏0
vue 學習小結送給新手

摘要：只要數據發生改變，立即更新，由表單等帶來的數據改變，數據相應字段也會發生相應改變。三界面的更新的輸入，導致的值更新，元素內，任何表達式與有關的，都將重新計算，斌企鵝自動更新界面。作為組件化思維的先驅當年統計的組件多達多個。 Vue 是現在最火的前端JavaScript 開發框架。首先，接受它的思想 View 模板即html，靜態界面Model 數據源模型界面所有的數據負責提供及管理...

terasum 2019-08-20 10:42 評論0 收藏0