refactor(v3): v-model(view)

packages/uni-app-plus/dist/index.v3.js

@@ -9147,17 +9147,17 @@ var serviceContext = (function () {
     return result
   }
 
-  function initData(Vue) {
+  function initData (Vue) {
     Vue.prototype._$s = setData;
     Vue.prototype._$i = setIfData;
     Vue.prototype._$f = setForData;
     Vue.prototype._$e = setElseIfData;
 
-    Vue.prototype._$setData = function setData(type, data) {
+    Vue.prototype._$setData = function setData (type, data) {
       this._$vd.push(type, this._$id, data);
     };
 
-    Vue.prototype._$mounted = function mounted() {
+    Vue.prototype._$mounted = function mounted () {
       if (!this._$vd) {
         return
       }
@@ -9170,7 +9170,7 @@ var serviceContext = (function () {
       }
     };
 
-    Vue.prototype._$updated = function updated() {
+    Vue.prototype._$updated = function updated () {
       if (!this._$vd) {
         return
       }
@@ -9188,13 +9188,13 @@ var serviceContext = (function () {
     };
 
     Object.defineProperty(Vue.prototype, '_$vd', {
-      get() {
+      get () {
         return this.$root._$vdomSync
       }
     });
 
     Vue.mixin({
-      beforeCreate() {
+      beforeCreate () {
         if (this.$options.mpType) {
           this.mpType = this.$options.mpType;
         }
@@ -9214,7 +9214,7 @@ var serviceContext = (function () {
           this._$newData = Object.create(null);
         }
       },
-      beforeUpdate() {
+      beforeUpdate () {
         if (!this._$vd) {
           return
         }
@@ -9223,7 +9223,7 @@ var serviceContext = (function () {
         console.log(`[${this._$id}] beforeUpdate ` + Date.now());
         this._$newData = Object.create(null);
       },
-      beforeDestroy() {
+      beforeDestroy () {
         if (!this._$vd) {
           return
         }
@@ -9233,7 +9233,7 @@ var serviceContext = (function () {
     });
   }
 
-  function setData(id, name, value) {
+  function setData (id, name, value) {
     switch (name) {
       case B_CLASS:
         value = this._$stringifyClass(value);
@@ -9253,7 +9253,7 @@ var serviceContext = (function () {
     return ((this._$newData[id] || (this._$newData[id] = {}))[name] = value)
   }
 
-  function setForData(id, value) {
+  function setForData (id, value) {
     const diffData = this._$newData[id] || (this._$newData[id] = {});
     const vForData = diffData[V_FOR] || (diffData[V_FOR] = []);
 
@@ -9274,11 +9274,11 @@ var serviceContext = (function () {
     return key
   }
 
-  function setIfData(id, value) {
+  function setIfData (id, value) {
     return ((this._$newData[id] || (this._$newData[id] = {}))[V_IF] = !!value)
   }
 
-  function setElseIfData(id, value) {
+  function setElseIfData (id, value) {
     return ((this._$newData[id] || (this._$newData[id] = {}))[V_ELSE_IF] = !!value)
   }
 

packages/uni-app-plus/dist/service.runtime.esm.js

@@ -6691,14 +6691,13 @@ var modules = platformModules.concat(baseModules);
 
 var patch = createPatchFunction({ nodeOps: nodeOps, modules: modules });
 
-var show = {
-  bind: function bind() {},
-  update: function update() {},
-  unbind: function unbind() {}
-};
+var model$1 = {};
+
+var show = {};
 
-var platformDirectives = {
-  show: show
+var platformDirectives = {
+  model: model$1,
+  show: show
 };
 
 var platformComponents = {

packages/uni-app-plus/dist/view.umd.js

@@ -13115,11 +13115,26 @@ function initEvent(Vue) {
     }
   });
 
+  Vue.prototype.$handleVModelEvent = function (nid, value) {
+    data["b" /* vd */].addUIEvent(this._$id, nid, {
+      type: 'input',
+      target: {
+        value: value
+      }
+    }); // 使用 setTimeout 做批量同步
+
+    setTimeout(function () {
+      data["b" /* vd */].sendUIEvent();
+    }, 0);
+  };
+
   Vue.prototype.$handleViewEvent = function ($vueEvent, options) {
+    var isCustomEvent = $vueEvent._processed; // 自定义事件已提前处理过
+
     var $event = this.$handleEvent($vueEvent);
     var cid = this._$id; // 当自定义组件根节点触发事件时，nid 始终为 0
 
-    var nid = $vueEvent.currentTarget === this.$el ? 0 : $event.options.nid;
+    var nid = isCustomEvent || $vueEvent.currentTarget === this.$el ? 0 : $event.options.nid;
 
     if (typeof nid === 'undefined') {
       return console.error("[".concat(cid, "] nid not found"));

packages/uni-template-compiler/__tests__/compiler-app-plus.view.spec.js

@@ -141,21 +141,21 @@ describe('codegen', () => {
   it('generate v-model directive', () => {
     assertCodegen(
       '<input v-model="test">',
-      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:(_$g(0,'v-model')),callback:function ($$v) {},expression:"_$g(0,'v-model')"}})}`
+      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function($$v){$handleVModelEvent(0,$$v)},expression:"test"}})}`
     )
   })
 
   it('generate multiline v-model directive', () => {
     assertCodegen(
       '<input v-model="\n test \n">',
-      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:(_$g(0,'v-model')),callback:function ($$v) {},expression:"_$g(0,'v-model')"}})}`
+      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function($$v){$handleVModelEvent(0,$$v)},expression:"\\n test \\n"}})}`
     )
   })
 
   it('generate multiline v-model directive on custom component', () => {
     assertCodegen(
       '<my-component v-model="\n test \n" />',
-      `with(this){return _c('my-component',{attrs:{"_i":0},model:{value:(_$g(0,'v-model')),callback:function ($$v) {},expression:"_$g(0,'v-model')"}})}`
+      `with(this){return _c('my-component',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function(){},expression:"\\n test \\n"}})}`
     )
   })
 

packages/uni-template-compiler/__tests__/demo.js

 const compiler = require('../lib')
 const res = compiler.compile(
   `
-<my-component v-model="\n test \n" />
+<input v-model="\n test \n">
 
 
     `, {
@@ -15,7 +15,7 @@ const res = compiler.compile(
     mp: {
       platform: 'app-plus'
     },
-    service: true,
+    // service: true,
     view: true
   })
 console.log(require('util').inspect(res, {

packages/uni-template-compiler/lib/app/view.js

@@ -83,7 +83,7 @@ function transformNode (el, parent, state) {
 
   parseIf(el, createGenVar)
   parseBinding(el, genVar)
-  parseDirs(el, genVar)
+  parseDirs(el, genVar, ['model'])
   parseAttrs(el, genVar)
   parseProps(el, genVar)
 }
@@ -135,12 +135,21 @@ function handleViewEvents (events) {
   })
 }
 
+function genVModel (el) {
+  if (el.model) {
+    el.model.value = createGenVar(el.attrsMap[ID])('v-model', el.model.value)
+    if (el.tag === 'v-uni-input' || el.tag === 'v-uni-textarea') {
+      el.model.callback = `function($$v){$handleVModelEvent(${el.attrsMap[ID]},$$v)}`
+    } else {
+      el.model.callback = `function(){}`
+    }
+  }
+}
+
 function genData (el) {
   delete el.$parentIterator3
 
-  if (el.model) {
-    el.model.callback = `function ($$v) {}`
-  }
+  genVModel(el)
 
   // 放在 postTransformNode 中处理的时机太靠前，v-model 等指令会新增 event
   el.events && handleViewEvents(el.events)

src/platforms/app-plus/view/framework/plugins/event.js

@@ -8,13 +8,27 @@ export function initEvent (Vue) {
     get () {
       return getCurrentPages()[0].$page
     }
-  })
+  })
+
+  Vue.prototype.$handleVModelEvent = function (nid, value) {
+    vd.addUIEvent(this._$id, nid, {
+      type: 'input',
+      target: {
+        value
+      }
+    })
+    // 使用 setTimeout 做批量同步
+    setTimeout(() => {
+      vd.sendUIEvent()
+    }, 0)
+  }
 
   Vue.prototype.$handleViewEvent = function ($vueEvent, options) {
+    const isCustomEvent = $vueEvent._processed // 自定义事件已提前处理过
     const $event = this.$handleEvent($vueEvent)
     const cid = this._$id
     // 当自定义组件根节点触发事件时，nid 始终为 0
-    const nid = $vueEvent.currentTarget === this.$el ? 0 : $event.options.nid
+    const nid = isCustomEvent || ($vueEvent.currentTarget === this.$el) ? 0 : $event.options.nid
     if (typeof nid === 'undefined') {
       return console.error(`[${cid}] nid not found`)
     }