一個簡單的vue 數(shù)據(jù)綁定實現(xiàn)

看了很多 關(guān)于vue 數(shù)據(jù)綁定的文章 現(xiàn)在自己動手實現(xiàn)一個簡單雙向綁定

首先我們寫個HTML結(jié)構(gòu)出來

接下來 看代碼

首先 我們創(chuàng)建一個空對象

然后使用 object的defineProprety屬性 在里面我們傳入要操作的對象 及對象的屬性 使用自帶的

get 和 set 方法

在get函數(shù)中我們返回一個dom文本

在set函數(shù)中 我們可以接受一個新的值 并把新值賦值給 獲取到的dom

最后在對象上添加name的屬性

最后看瀏覽器結(jié)果

• 人面猴

  序言：七十年代末憋飞，一起剝皮案震驚了整個濱河市蛆楞，隨后出現(xiàn)的幾起案子浸赫，更是在濱河造成了極大的恐慌铺厨，老刑警劉巖入篮，帶你破解...

  沈念sama閱讀 211,348評論 6贊 491
• 死咒

  序言：濱河連續(xù)發(fā)生了三起死亡事件贾惦，死亡現(xiàn)場離奇詭異癣诱，居然都是意外死亡盹沈，警方通過查閱死者的電腦和手機龄章，發(fā)現(xiàn)死者居然都...

  沈念sama閱讀 90,122評論 2贊 385
• 救了他兩次的神仙讓他今天三更去死

  文/潘曉璐 我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來乞封，“玉大人做裙，你說我怎么就攤上這事∷嗤恚” “怎么了锚贱？”我有些...

  開封第一講書人閱讀 156,936評論 0贊 347
• 道士緝兇錄：失蹤的賣姜人

  文/不壞的土叔 我叫張陵，是天一觀的道長关串。 經(jīng)常有香客問我拧廊，道長监徘，這世上最難降的妖魔是什么？ 我笑而不...

  開封第一講書人閱讀 56,427評論 1贊 283
• ?港島之戀（遺憾婚禮）

  正文 為了忘掉前任吧碾，我火速辦了婚禮凰盔，結(jié)果婚禮上，老公的妹妹穿的比我還像新娘倦春。我一直安慰自己户敬，他們只是感情好，可當我...

  茶點故事閱讀 65,467評論 6贊 385
• 惡毒庶女頂嫁案：這布局不是一般人想出來的

  文/花漫 我一把揭開白布睁本。 她就那樣靜靜地躺著尿庐，像睡著了一般。 火紅的嫁衣襯著肌膚如雪呢堰。 梳的紋絲不亂的頭發(fā)上抄瑟，一...

  開封第一講書人閱讀 49,785評論 1贊 290
• 城市分裂傳說

  那天，我揣著相機與錄音枉疼，去河邊找鬼锐借。 笑死，一個胖子當著我的面吹牛往衷，可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播严卖，決...

  沈念sama閱讀 38,931評論 3贊 406
• 雙鴛鴦連環(huán)套：你想象不到人心有多黑

  文/蒼蘭香墨 我猛地睜開眼席舍，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了哮笆？” 一聲冷哼從身側(cè)響起来颤，我...

  開封第一講書人閱讀 37,696評論 0贊 266
• 萬榮殺人案實錄

  序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎稠肘，沒想到半個月后福铅，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...

  沈念sama閱讀 44,141評論 1贊 303
• ?護林員之死

  正文 獨居荒郊野嶺守林人離奇死亡项阴，尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...

  茶點故事閱讀 36,483評論 2贊 327
• ?白月光啟示錄

  正文 我和宋清朗相戀三年滑黔，在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片环揽。...

  茶點故事閱讀 38,625評論 1贊 340
• 活死人

  序言：一個原本活蹦亂跳的男人離奇死亡略荡，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出歉胶，到底是詐尸還是另有隱情汛兜，我是刑警寧澤，帶...

  沈念sama閱讀 34,291評論 4贊 329
• ?日本核電站爆炸內(nèi)幕

  正文 年R本政府宣布通今，位于F島的核電站粥谬，受9級特大地震影響肛根，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜漏策，卻給世界環(huán)境...

  茶點故事閱讀 39,892評論 3贊 312
• 男人毒藥：我在死后第九天來索命

  文/蒙蒙 一派哲、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧哟玷，春花似錦狮辽、人聲如沸。這莊子的主人今日做“春日...

  開封第一講書人閱讀 30,741評論 0贊 21
• 一樁弒父案喉脖，背后竟有這般陰謀

  文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至抑月，卻和暖如春树叽，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背谦絮。 一陣腳步聲響...

  開封第一講書人閱讀 31,977評論 1贊 265
• 情欲美人皮

  我被黑心中介騙來泰國打工题诵， 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人层皱。 一個月前我還...

  沈念sama閱讀 46,324評論 2贊 360
• 代替公主和親

  正文 我出身青樓性锭，卻偏偏與公主長得像，于是被迫代替她去往敵國和親叫胖。 傳聞我的和親對象是個殘疾皇子草冈，可洞房花燭夜當晚...

  茶點故事閱讀 43,492評論 2贊 348

推薦閱讀更多精彩內(nèi)容

• 一個簡單的vue雙向綁定實現(xiàn)案例

  最近面試經(jīng)常會問這個問題，你知道vue的雙向綁定是通過什么實現(xiàn)的嗎瓮增？了解的同學應(yīng)該知道vue是使用Object.d...

  Mr丶Sunny閱讀 2,784評論 0贊 2
• vue的雙向綁定原理及實現(xiàn)

  前言 使用vue也好有一段時間了怎棱，雖然對其雙向綁定原理也有了解個大概，但也沒好好探究下其原理實現(xiàn)绷跑，所以這次特意花了...

  指尖跳動閱讀 7,981評論 0贊 16
• 從零寫最簡單代碼實現(xiàn)類似vue.js的雙向綁定

  前言 我們知道vue.js用v-model實現(xiàn)了數(shù)據(jù)雙向綁定拳恋，原理大約是：vue使用Object.definePr...

  microkof閱讀 552評論 0贊 0
• VUE雙向綁定原理

  前言 在之前面試中，有被問到這個問題砸捏，雖然了解過是劫持Object.defineProperty方法谬运，但是其細節(jié)并...

  Aleph_Zheng閱讀 1,070評論 0贊 5
• 海天味業(yè)呈規(guī)拇ぃ化發(fā)展

  海天味業(yè)呈規(guī)姆郧化發(fā)展。自海天味業(yè)規(guī)南ヅ海化生產(chǎn)以來式廷，年銷量持續(xù)增加，處于行業(yè)中領(lǐng)先的地位芭挽』希回顧海天醬油的產(chǎn)銷量蝗肪，已經(jīng)連...

  cc0228閱讀 496評論 0贊 0