美文网首页
上课无聊看看vue 源码

上课无聊看看vue 源码

作者: 简单点_cc32 | 来源:发表于2018-09-18 14:54 被阅读0次

看了很多关于vue 的文章和视频,总觉得vue 有很多神秘的面纱,我决定尝试着揭开这神秘的面纱。vue 源码里面有很多出出现了Object. defineProperty()这个方法

所以先粗浅的看看这个东东

let  obj = {}

Object.defineProperty("obj ","xxx ",{

          val:10,

          writable: true,

          enumerable: true,

          configurable:true

})

这就是vue 中data descriptor, 用手机敲代码是真费劲

let  otherValue = 5

Object.defineProperty(obj,"x",{

          get: function (){

                  return  otherValue

          },

            set: function (newValue){

                  otherValue = newValue

            },

            enumerable: true,

            configurable:true

})

obj. x      //5

一目了然,取值的时候get 一下

以上两种不能混着用,太辛苦了,我就不举例子了。

我最感兴趣的地方还是view controller

来了来了

<div>

      div    p  id =  box    p  div

      div  id  =  wrap

    符号打恶心了,见谅

</div>

let userProfile = {}

Object.defineProperty (userProfile,"box ",{

          get:function (){

                return document.getElementById("box ").innerHTML,

          },

          set:function(val ) {

          document.getElementById("box “).innerHTML = val

          }

})

Object.defineProperty (userProfile,"wrap",{

          get:function (){

                return document.getElementById("wrap").innerHTML,

          },

          set:function(Value) {

          document.getElementById("box “).innerHTML = Value

          }

})

这样差不多就是一个简单的

数据驱动了,由于此文是我很久之前看的一个文章,今天伴着我左边打王者的同桌和右边睡觉的同桌以及周围开黑的快乐的声音下完成的,如果有什么错误,别喷。

相关文章

网友评论

      本文标题:上课无聊看看vue 源码

      本文链接:https://www.haomeiwen.com/subject/cjxpnftx.html