如何在原生或jq页面项目中引入像vue{{}}的页面解析（主要针对解决页面多语言）

-首先我们需要引入一个js；

/*!
 * mvvm.js v1.4.3 (c) 2019 TANG
 * Released under the MIT license
 * Thu Feb 07 2019 16:57:28 GMT+0800 (CST)
 */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.MVVM=e()}(this,function(){"use strict";function t(t,e){return typeof t===e}function e(t){return"[object Object]"===Kt.toString.call(t)}function n(t){return Array.isArray(t)}function i(e){return t(e,"function")}function s(e){return t(e,"string")}function r(e){return t(e,"boolean")}function o(e){return t(e,"number")&&!isNaN(e)}function h(t){return!(!t||!e(t)||t.nodeType||t===t.window)&&!(t.constructor&&!Xt.call(t.constructor.prototype,"isPrototypeOf"))}function u(t){return 0===Object.keys(t).length}function a(t){return null==t?"":t.toString()}function c(t){if(s(t)){var e=Number(t);return o(e)?e:t}return t}function l(){}function f(){Yt&&Yt.warn.apply(Yt,arguments)}function d(){Yt&&Yt.error.apply(Yt,arguments)}function p(t,e){return t&&Xt.call(t,e)}function v(t,e,n,i){return Object.defineProperty(t,e,{value:n,writable:!0,enumerable:!!i,configurable:!0})}function _(t,i,s){var r,o;if(s||(s=this),n(t))for(r=0;r<t.length&&!1!==(o=i.call(s,t[r],r,t));r++)null===o&&(t.splice(r,1),r--);else if(e(t)){var h=Object.keys(t);for(r=0;r<h.length;r++){var u=h[r];if(!1===(o=i.call(s,t[u],u,t)))break;null===o&&delete t[u]}}}function m(){var t,e,s,o,u,a,c=arguments,l=arguments[0]||{},f=1,d=arguments.length,p=!1;for(r(l)&&(p=l,l=arguments[f]||{},f++),"object"==typeof l||i(l)||(l={}),f===d&&(l=this,f--);f<d;f++)if(null!=(t=c[f]))for(e in t)s=l[e],o=t[e],l!==o&&(p&&o&&(h(o)||(u=n(o)))?(u?(u=!1,a=s&&n(s)?s:[]):a=s&&h(s)?s:{},l[e]=m(p,a,o)):void 0!==o&&(l[e]=o));return l}function b(t){var i;return n(t)?i=m(!0,[],t):e(t)&&(i=m(!0,{},t)),i||t}function g(){return document.createDocumentFragment()}function y(t){for(var e,n=g();e=t.firstChild;)n.appendChild(e);return n}function w(t){return t.replace(te,"")}function $(t,e,n){if(!e)return t;for(var i=e.split(".");i.length>1&&p(t,i[0]);)t=t[i.shift()];return e=i[0],void 0!==n?void(t[e]=n):t[e]}function x(t){this.path=t,this.watchers=[],this.guid=ee++}function k(t){return t}function O(t){return""}function C(t){var e=t.charCodeAt(0);if(e>=65&&e<=90||e>=97&&e<=122||e>=48&&e<=57)return ie;switch(e){case 91:case 93:case 46:case 34:case 39:return se;default:return re}}function A(t){var e=[],n=t.split(""),i=n.length-1,s=C(n[0]);return he.init(s),_(n,function(t,n){var s=C(t),r=he.set(s,t);r&&e.push(r),n===i&&he.saves&&(e.push(he.saves),he.reset())}),e}function N(t,e){for(;e.length;)t=t[e.shift()];return t}function D(t){return A(w(t))}function I(t,n,i){var s=b(i),r=s.pop(),o=N(t,s);e(o)&&(o[r]=n)}function T(t){var e=pe.length;return pe[e]=t,'"'+e+'"'}function j(t,e){return pe[e]}function L(t){return 0===t.indexOf("$event")||_e.test(t)}function E(t){var e=t.charAt(0),n=t.slice(1);return L(n)?t:(n=n.indexOf('"')>-1?n.replace(ue,j):n,e+"scope."+n)}function S(t){return fe.test(t)&&!ae.test(t)}function P(t){return S(t)?"scope."+t:(t=(" "+t).replace(ce,T),t=t.replace(le,E),t=t.replace(ue,j))}function U(t){if(me.test(t))return f("Avoid using unallow keyword in expression ["+t+"]"),l;try{return new Function("scope","return "+P(t)+";")}catch(e){return d("Invalid generated expression: ["+t+"]"),l}}function V(t){var e=D(t);return e.length?function(t,n){I(t,n,e)}:(d("Invalid setter expression ["+t+"]"),l)}function z(t,e){var n=t&&t.__ob__,i=n&&n.dep.guid;if(i){if(be.indexOf(i)>-1)return;be.push(i)}_(t,function(t){z(t,!1)}),e&&(be.length=0)}function M(t,e,n,s){this.vm=t,m(this,e),this.callback=n,this.context=s||this,this.depIds=[],this.newDepIds=[],this.shallowIds=[],this.depends=[],this.newDepends=[];var r=e.once,o=e.expression,h=i(o);this.getter=h?o:U(o),this.setter=!r&&e.duplex?V(o):null,this.oldVal=null,this.value=r?this.getValue():this.get()}function F(t){this.parser=t,this.scope=t.scope}function R(t,e,n,i){this.vm=t,this.el=e,this.desc=n,this.scope=i,this.parse()}function q(t){return t.prototype=Object.create(R.prototype)}function H(t){return 1===t.nodeType}function B(t){return 3===t.nodeType}function W(t){for(;t.firstChild;)t.removeChild(t.firstChild);return t}function Z(t,e){return t.getAttribute(e)||""}function G(t,e){t.removeAttribute(e)}function Q(t,e,n){if(null==n||!1===n)return G(t,e);!0===n?(t[e]=n,J(t,e)||t.setAttribute(e,"")):n!==Z(t,e)&&t.setAttribute(e,n)}function J(t,e){return t.hasAttribute(e)}function K(t,e){var n,i=t.classList;return i?i.contains(e):(n=" "+Z(t,"class")+" ",n.indexOf(" "+e+" ")>-1)}function X(t,e){var n,i=t.classList;e&&!K(t,e)&&(i?i.add(e):(n=" "+Z(t,"class")+" ",-1===n.indexOf(" "+e+" ")&&Q(t,"class",(n+e).trim())))}function Y(t,e){var n,i,s=t.classList;if(e&&K(t,e)){if(s)s.remove(e);else{for(i=" "+e+" ",n=" "+Z(t,"class")+" ";n.indexOf(i)>-1;)n=n.replace(i," ");Q(t,"class",n.trim())}t.className||G(t,"class")}}function tt(t,e,n,i){t.addEventListener(e,n,i)}function et(t,e,n,i){t.removeEventListener(e,n,i)}function nt(t,e){var n=e.split("."),i=n.indexOf("self")>-1,s=n.indexOf("stop")>-1,r=n.indexOf("one")>-1,o=n.indexOf("prevent")>-1,h=n.indexOf("capture")>-1,u=null;return 0===t.indexOf("key")&&_(n,function(t){if(/^(\d)*$/.test(t))return u=+t,!1}),{self:i,stop:s,prevent:o,capture:h,keyCode:u,one:r}}function it(t){var e=[],n=t.args,i=t.expression.trim();if(n){var s=n.indexOf("."),r=-1===s?n:n.substr(0,s),o=-1===s?"":n.substr(s+1,n.length);e=[{type:r,handler:i,modifier:o}]}else/^{.*}$/.test(i)&&(i=i.substr(1,i.length-2),_(w(i).split(","),function(t){var n=t.split(":");e.push({type:n[0],handler:n[1],modifier:""})}));return e}function st(t){try{return new Function("scope","$event",P(t))}catch(e){return d("Invalid generated expression: ["+t+"]"),l}}function rt(){R.apply(this,arguments)}function ot(){R.apply(this,arguments)}function ht(t){for(var e=0;e<Ce.length;e++){var n=Ce[e];v(t,n,Oe[n])}}function ut(t){xe?t.__proto__=Oe:ht(t)}function at(t,e){return t?t+"*"+e:e}function ct(t,e){_(t,function(n,i){pt(t,i,n,at(e,i))})}function lt(t,e){ut(t),_(t,function(t,n){dt(t,at(e,n))})}function ft(t,e){this.dep=new x(e),n(t)?lt(t,e):ct(t,e),v(t,"__ob__",this)}function dt(t,i){if(e(t)||n(t))return p(t,"__ob__")?t.__ob__:new ft(t,i||"")}function pt(t,e,i,s){var r=new x(s),o=Object.getOwnPropertyDescriptor(t,e),h=o&&o.get,u=o&&o.set,a=dt(i,s);Object.defineProperty(t,e,{get:function(){var e=h?h.call(t):i;return x.watcher&&(r.depend(),a&&a.dep.depend()),n(e)&&_(e,function(t){var e=t&&t.__ob__;e&&e.dep.depend()}),e},set:function(n){n!==(h?h.call(t):i)&&(r.beforeNotify(),u?u.call(t,n):i=n,a=dt(n,e),r.notify())}})}function vt(t,e){var n=new M(t,{expression:e.bind(t)});return function(){return x.watcher&&_(n.depends,function(t){t.depend()}),n.value}}function _t(t,e){_(e,function(e,n){if(!i(e))return f("computed property ["+n+"] must be a getter function!");Object.defineProperty(t,n,{set:l,get:vt(t,e)})})}function mt(t,e){var n,i,s=t.$hooks,r=e.__afterHook__,o=e.__beforeHook__;return r&&(n=s[r]),o&&(i=s[o]),{after:n,before:i}}function bt(){return Math.random().toString(36).substr(2)}function gt(){R.apply(this,arguments)}function yt(t,e){for(var n=t.$els,i=e.childNodes,s=0;s<i.length;s++){var r=i[s];if(H(r)){for(var o=r.attributes,h=0;h<o.length;h++){var u=o[h];"v-el"===u.name&&p(n,u.value)&&(n[u.value]=null)}r.hasChildNodes()&&yt(t,r)}}}function wt(){return document.createTextNode("")}function $t(t,e){var n=t.parentNode;n&&n.replaceChild(e,t)}function xt(){R.apply(this,arguments)}function kt(){R.apply(this,arguments)}function Ot(){R.apply(this,arguments)}function Ct(t){var e=t.style.display;v(t,Le,"none"===e?"":e)}function At(t,e){t.style.display=e}function Nt(){R.apply(this,arguments)}function Dt(t,i){var s={};return _(t,function(t,r){var o,h=i[r];if(e(t))o=Dt(t,h),u(o)||(s[r]=o);else if(n(t)){var a=[];_(t,function(t,n){var i;e(t)?(i=Dt(t,h[n]),a.push(i)):h.indexOf(t)<0&&a.push(t)}),s[r]=a}else t!==h&&(s[r]=t)}),s}function It(t,e){var i=[];return n(t)&&n(e)?(_(t,function(t){e.indexOf(t)<0&&i.push(t)}),i):t}function Tt(t,i){var s=n(t)&&n(i),r=e(t)&&e(i),o=r?Dt:s?It:null;return{after:o&&o(t,i)||t,before:o&&o(i,t)||i}}function jt(t,n){var i=t.style;if(!e(n))return f("v-bind for style must be a type of Object",n);_(n,function(t,e){i[e]!==t&&(i[e]=t)})}function Lt(t,e,n){_(e.split(" "),function(e){n?Y(t,e):X(t,e)})}function Et(t,i,r){s(i)?Lt(t,i,r):n(i)?_(i,function(e){Lt(t,e,r)}):e(i)&&_(i,function(e,n){Lt(t,n,r||!e)})}function St(){R.apply(this,arguments)}function Pt(t,e){Pe=Date.now(),setTimeout(function(){Date.now()-Pe>=e&&t.call(t)},e)}function Ut(t,e){for(var n=[],i=t.options,s=0;s<i.length;s++){var r=i[s],o=r.value;r.selected&&n.push(Vt(o,e))}return n}function Vt(t,e){return e?c(t):t}function zt(t,e){for(var n=0;n<e.length;n++)if(e[n]==t)return n;return-1}function Mt(){R.apply(this,arguments)}function Ft(){R.apply(this,arguments)}function Rt(t){return 0===t.indexOf("v-")}function qt(t){return H(t)&&J(t,"v-once")}function Ht(t){return J(t,"v-if")||J(t,"v-for")||J(t,"v-pre")}function Bt(t){if(H(t)&&t.hasAttributes()){for(var e=t.attributes,n=0;n<e.length;n++)if(Rt(e[n].name))return!0}else if(B(t)&&Ge.test(t.textContent))return!0}function Wt(t){var e,n,i=t.name,s=t.value,r=i.indexOf(":");return r>-1?(n=i.substr(r+1),e=i.substr(0,r)):e=i,{args:n,attr:i,directive:e,expression:s}}function Zt(t){t.__afterHook__||v(t,"__afterHook__",Z(t,"v-hook:after")),t.__beforeHook__||v(t,"__beforeHook__",Z(t,"v-hook:before"))}function Gt(t,e){var n,i,s;return function(r,o,h){var u=r.path;u===n&&o===i&&h===s||(t.apply(e,arguments),n=u,i=o,s=h)}}function Qt(t){var n=t.model,r=t.view,o=t.computed,h=t.watchAll;return s(r)&&(r=document.querySelector(r)),r&&H(r)?e(n)?(this.$queue=[],this.$data=n,this.$element=r,this.$els={},this.$directives=[],this.$context=t.context||this,dt(this.$data),o&&_t(this.$data,o),this.$afters=[],this.$hooks=t.hooks||{},this.$customs=t.customs||{},this.$watchall=i(h)?Gt(h,this.$context):null,void(t.lazy||this.mount())):f("model must be a type of Object: ",n):f("view must be a type of DOMElement: ",r)}function Jt(t){var n=t.context||t.model;_(t.model,function(e,s){i(e)&&(t.model[s]=e.bind(n))}),_(t.methods,function(e,i){t.model[i]=e.bind(n)}),this.__ct__=n,this.__bk__=b(t.model),this.__vm__=new Qt(t),this.$data=this.__vm__.$data,this.$els=this.__vm__.$els,_(t.watches,function(t,n){i(t)?this.watch(n,t,!1):e(t)&&this.watch(n,t.handler,t.deep)},this)}var Kt=Object.prototype,Xt=Kt.hasOwnProperty,Yt=window.console,te=/\s/g,ee=0;x.watcher=null;var ne=x.prototype;ne.addWatcher=function(t){this.watchers.push(t)},ne.removeWatcher=function(t){this.watchers.$remove(t)},ne.depend=function(){x.watcher&&x.watcher.addDepend(this)},ne.beforeNotify=function(){_(this.watchers,function(t){t.beforeUpdate()})},ne.notify=function(t){_(this.watchers,function(e){e.update(t,this)},this)};var ie=1,se=2,re=1,oe=[0,k,O,k],he={init:function(t){this.saves="",this.state=t},set:function(t,e){var n=this.get(t),i=n.keepIdent,s=n.tobeQuote,r=n.tobeIdent;if(i)this.save(t,e);else{if(s){var o=this.saves;return this.saves="",this.change(t),o}r&&(this.save(t,e),this.change(t))}},get:function(t){var e=this.state;return{keepIdent:e===ie&&t===ie,tobeQuote:(e===ie||0===e)&&t===se,keepQuote:e===se&&t===se,tobeIdent:(e===se||0===e)&&t===ie}},change:function(t){this.state=t},save:function(t,e){this.saves+=oe[t](e)},reset:function(){this.saves="",this.state=0}},ue=/"(\d+)"/g,ae=/^(true|false)$/,ce=/[\{,]\s*[\w\$_]+\s*:|('[^']*'|"[^"]*")|typeof /g,le=/[^\w$\.]([A-Za-z_$][\w$]*(\.[A-Za-z_$][\w$]*|\['.*?'\]|\[".*?"\])*)/g,fe=/^[A-Za-z_$][\w$]*(\.[A-Za-z_$][\w$]*|\['.*?'\]|\[".*?"\]|\[\d+\]|\[[A-Za-z_$][\w$]*\])*$/,de="var.const.let.if.else.for.in.continue.switch.case.break.default.function.return.do.while.delete.try.catch.throw.finally.with.import.export.instanceof.yield.await",pe=[],ve="JSON.Math.parseInt.parseFloat.Date.this.true.false.null.undefined.Infinity.NaN.isNaN.isFinite.decodeURI.decodeURIComponent.encodeURI.encodeURIComponent."+de,_e=new RegExp("^("+ve.replace(/\./g,"\\b|")+"\\b)"),me=new RegExp("^("+de.replace(/\./g,"\\b|")+"\\b)"),be=[],ge=M.prototype;ge.getScope=function(){return this.context.scope||this.vm.$data},ge.getValue=function(){var t=this.getScope();return this.getter.call(t,t)},ge.setValue=function(t){var e=this.getScope();this.setter&&this.setter.call(e,e,t)},ge.get=function(){this.beforeGet();var t=this.getValue();return this.deep&&(this.shallowIds=b(this.newDepIds),z(t,!0)),this.afterGet(),t},ge.beforeGet=function(){x.watcher=this},ge.addDepend=function(t){var e=t.guid,n=this.newDepIds;n.indexOf(e)<0&&(n.push(e),this.newDepends.push(t),this.depIds.indexOf(e)<0&&t.addWatcher(this))},ge.removeDepends=function(t){_(this.depends,function(e){t?t.call(this,e)&&e.removeWatcher(this):e.removeWatcher(this)},this)},ge.afterGet=function(){x.watcher=null,this.removeDepends(function(t){return this.newDepIds.indexOf(t.guid)<0}),this.depIds=b(this.newDepIds),this.newDepIds.length=0,this.depends=b(this.newDepends),this.newDepends.length=0},ge.beforeUpdate=function(){this.oldVal=b(this.value)},ge.update=function(t,e){var n=this.oldVal,i=this.vm.$watchall,s=this.value=this.get(),r=t&&t.source;if(!r||r===s||"v-for"!==this.directive){var o=this.callback,h=this.deep&&this.shallowIds.indexOf(e.guid)<0;o&&n!==s&&(o.call(this.context,s,n,h,t),r&&(t.source=null)),i&&i({action:t,path:e.path},s,n)}},ge.destroy=function(){this.value=null,this.removeDepends(),this.getter=this.setter=null,this.vm=this.callback=this.context=null};var ye=F.prototype;ye.mount=function(){var t=this.parser,e=this.watcher=new M(t.vm,t.desc,this.update,this);this.update(e.value)},ye.destroy=function(){this.watcher.destroy(),this.parser=this.scope=null},ye.update=function(){var t=this.parser;t.update.apply(t,arguments)},ye.get=function(){return this.watcher.value},ye.set=function(t){this.watcher.setValue(t)};var we=R.prototype;we.bind=function(){this.directive=new F(this),this.directive.mount()},we.destroy=function(){var t=this.directive;t&&t.destroy(),this.vm=this.el=this.desc=this.scope=null};var $e=q(rt);$e.parse=function(){_(it(this.desc),function(t){this.parseEvent(t)},this)},$e.parseEvent=function(t){var e=t.type,n=t.handler,i=t.modifier,s=nt(e,i);if("$remove"===n)return this.bindRemoveEvent(e,s);var r=S(n)?n+"($event)":n;this.bindEvent(e,st(r),s)},$e.bindRemoveEvent=function(t,e){var n=this.scope;if(!n)return f("The specify event $remove must be used in v-for scope");var i=n.__alias__;this.bindEvent(t,function(){n.__viterator__.$remove(n[i])},e)},$e.bindEvent=function(t,e,n){var i=this.el,s=this.scope||this.vm.$data,r=n.self,o=n.stop,h=n.prevent,u=n.capture,a=n.keyCode,c=n.one,l=function(t){r&&t.target!==i||a&&a!==t.keyCode||(h&&t.preventDefault(),o&&t.stopPropagation(),e.call(s,s,t))},f=c?function(e){l(e),et(i,t,f,u)}:l;tt(i,t,f,u)},q(ot).parse=function(){this.scope?f("v-el can not be used inside v-for! Consider use v-custom to handle v-for element."):this.vm.$els[this.desc.expression]=this.el};var xe="__proto__"in{},ke=Array.prototype,Oe=Object.create(ke);_(["pop","push","sort","shift","splice","unshift","reverse"],function(t){var e=ke[t];v(Oe,t,function(){for(var n=arguments,i=[],s=this.__ob__,r=0;r<arguments.length;r++)i.push(n[r]);s.dep.beforeNotify();var o,h=e.apply(this,i);switch(t){case"push":case"unshift":o=i;break;case"splice":o=i.slice(2)}return o&&o.length&&lt(o),s.dep.notify({method:t,args:i,source:this}),h})}),v(ke,"$set",function(t,e){return t>=this.length&&(t=this.length),this.splice(t,1,e)[0]}),v(ke,"$remove",function(t){var e=this.indexOf(t);if(e>-1)return this.splice(e,1)});var Ce=Object.getOwnPropertyNames(Oe),Ae=/(.*) (?:in|of) (.*)/,Ne="push|pop|shift|unshift|splice".split("|"),De=q(gt);De.parse=function(){var t=this.el,e=this.desc,n=t.parentNode,i=e.expression,s=i.match(Ae);if(!s)return f('The format of v-for must be like "item in/of items"!');if(1!==n.nodeType)return f("v-for cannot use in the root element!");if(J(t,"v-if"))return f("Do not use v-if and v-for on the same element! Consider filtering the source Array instead.");var r=s[1],o=s[2];this.length=0,this.scopes=[],this.init=!0,this.alias=r,this.partly=!1,this.partlyArgs=[],this.$parent=n,this.end=t.nextSibling,this.start=t.previousSibling,this.bodyDirs=t.__dirs__,this.tpl=t.cloneNode(!0),this.hooks=mt(this.vm,t),this.isOption="OPTION"===t.tagName&&"SELECT"===n.tagName,e.expression=o,this.bind(),this.updateModel()},De.updateModel=function(){if(this.isOption){var t=this.$parent.__vmodel__;t&&t.forceUpdate()}},De.hook=function(t,e,n){var s=this.hooks[t];i(s)&&(s.call(this.vm.$context,e,n,e.__vforid__),e=null)},De.update=function(t,e,n,i){this.length=t&&t.length,this.init?(this.$parent.replaceChild(this.buildList(t),this.el),this.el=null,this.init=!1):i&&Ne.indexOf(i.method)>-1?(this.partly=!0,this.updatePartly(t,i),this.partly=!1):(this.recompileList(t),this.updateModel())},De.updatePartly=function(t,e){var n=[],i=e.args,s=e.method,r=this.scopes;switch(this[s].call(this,t,i),s){case"pop":case"shift":break;case"push":case"unshift":n=this.partlyArgs;break;case"splice":n=i.slice(0,2),Array.prototype.push.apply(n,this.partlyArgs)}r[s].apply(r,n),this.partlyArgs.length=0,_(r,function(t,e){t.$index=e})},De.recompileList=function(t){for(var e=this,n=0,i=this.$parent,s=i.childNodes,r=0;r<s.length;r++){var o=s[r];o.__vfor__===e.alias&&(e.hook("before",o,n++),i.removeChild(o),r--)}this.scopes.length=0;var h=this.buildList(t);i.insertBefore(h,this.end)},De.buildList=function(t,e){var n=this.vm,i=this.tpl,s=e||0,r=g(),o=this.directive.watcher.value;return _(t,function(t,e){var h=s+e,u=this.alias,a=i.cloneNode(!0),c=this.scope||n.$data,l=Object.create(c);l.$parent=c,pt(l,u,t),pt(l,"$index",h),v(l,"__alias__",u),v(l,"__viterator__",o),this.partly?this.partlyArgs.push(l):this.scopes.push(l),this.init&&this.bodyDirs>1&&n.block(this.el),v(a,"__vfor__",u),v(a,"__vforid__",bt()),n.compile(a,!0,l,this.desc.once),r.appendChild(a),this.hook("after",a,h)},this),r},De.getChilds=function(){for(var t=this,e=[],n=this.$parent.childNodes,i=0;i<n.length;i++){var s=n[i];s.__vfor__===t.alias&&e.push(s)}return e},De.getFirst=function(){var t=this.start;return t&&t.nextSibling||this.$parent.firstChild},De.getLast=function(){var t=this.end;return t&&t.previousSibling||this.$parent.lastChild},De.getChild=function(t){return this.getChilds()[t]||null},De.removeChild=function(t){t&&this.$parent.removeChild(t)},De.shift=function(){var t=this.getFirst();t&&(this.hook("before",t,0),this.removeChild(t))},De.pop=function(){var t=this.getLast();t&&(this.hook("before",t,this.length),this.removeChild(t))},De.push=function(t,e){var n=this.buildList(e,t.length-1);this.$parent.insertBefore(n,this.end)},De.unshift=function(t,e){var n=this.getFirst(),i=this.buildList(e,0);this.$parent.insertBefore(i,n)},De.splice=function(t,e){var n=e[0],i=e[1],s=e.slice(2),r=s.length;if(0!==i||r){var o=i&&!r,h=!i&&r,u=i&&r;if(o||u){var a=this.getChilds();_(a,function(t,e){e>=n&&e<n+i&&(this.hook("before",t,e),this.removeChild(t))},this),a=null}if(h||u){var c=this.getChild(n)||this.end,l=this.buildList(s,n);this.$parent.insertBefore(l,c)}}};var Ie=q(xt);Ie.parse=function(){var t=this.el,e=t.nextElementSibling,n=t.parentNode;if(1!==n.nodeType)return f("v-if cannot use in the root element!");this.$parent=n,this.hooks=mt(this.vm,t),this.elTpl=t.cloneNode(!0),this.elAnchor=wt(),$t(t,this.elAnchor),this.el=null,e&&J(e,"v-else")&&(this.elseTpl=e.cloneNode(!0),this.elseAnchor=wt(),$t(e,this.elseAnchor),e=null),this.bind()},Ie.hook=function(t,e,n){var s=this.hooks[t];i(s)&&s.call(this.vm.$context,e,n)},Ie.update=function(t){var e=this.elseAnchor;this.toggle(this.elAnchor,this.elTpl,t,!1),e&&this.toggle(e,this.elseTpl,!t,!0)},Ie.toggle=function(t,e,n,i){var s=this.vm,r=this.$parent,o=e.cloneNode(!0);if(n){s.compile(o,!0,this.scope,this.desc.once);var h=r.insertBefore(o,t);this.hook("after",h,i),v(h,"__vif__",!0)}else{var u=t.previousSibling;u&&u.__vif__&&(this.hook("before",u,i),yt(s,e),r.removeChild(u))}};var Te=q(kt);Te.parse=function(){this.bind()},Te.update=function(t){this.el.textContent=a(t)};var je=q(Ot);je.parse=function(){this.bind()},je.update=function(t){this.el.innerHTML=a(t)};var Le="__visible__",Ee=q(Nt);Ee.parse=function(){var t=this.el;Ct(t);var e=t.nextElementSibling;e&&J(e,"v-else")&&(this.elseEl=e,Ct(e)),this.bind()},Ee.update=function(t){var e=this.el,n=this.elseEl;At(e,t?e[Le]:"none"),n&&At(n,t?"none":n[Le])};var Se=q(St);Se.parse=function(){this.desc.deep=!0,this.bind()},Se.update=function(t,e){var n=this.desc.args;n?this.single(n,t,e):this.multi(t,e)},Se.single=function(t,e,n){switch(t){case"class":this.processClass(e,n);break;case"style":this.processStyle(e,n);break;default:this.processAttr(t,e)}},Se.multi=function(t,e){if(e){var n=Tt(t,e),i=n.after,s=n.before;this.batch(i,s)}this.batch(t)},Se.batch=function(t,e){_(t,function(t,n){this.single(n,t,e&&e[n])},this)},Se.processClass=function(t,e){var n=this.el;if(e){var i=Tt(t,e),s=i.after;Et(n,i.before,!0),Et(n,s)}else Et(n,t)},Se.processStyle=function(t,e){var n=this.el;e&&(_(e,function(t,n){e[n]=""}),jt(n,e)),jt(n,t)},Se.processAttr=function(t,e){Q(this.el,t,e)};var Pe=0,Ue=window.navigator.userAgent.toLowerCase(),Ve=Ue&&Ue.indexOf("msie 9.0")>0,ze={bind:function(){function t(t){i&&(t=t.trim());var e=Vt(t,r);o?Pt(function(){n.onDebounce=!0,h.set(e)},c(o)):h.set(e)}var e,n=this,i=this.trim,s=this.lazy,r=this.number,o=this.debounce,h=this.directive;this.on("compositionstart",function(){e=!0}),this.on("compositionend",function(){e=!1,s||t(this.value)}),this.on("input",function(){e||s||t(this.value)}),this.on("blur",function(){t(this.value)}),this.on("change",function(){t(this.value)}),Ve&&(this.on("cut",function(){t(this.value)}),this.on("keyup",function(e){var n=e.keyCode;8!==n&&46!==n||t(this.value)}))},update:function(t){var e=this.el,n=a(t);e.value===n||this.onDebounce||(e.value=n)}},Me={bind:function(){var t=this.number,e=this.directive;this.on("change",function(){e.set(Vt(this.value,t))})},update:function(t){var e=this.el;e.checked=e.value===a(t)}},Fe={bind:function(){var t=this.multi,e=this.number,n=this.directive;this.on("change",function(){var i=t?Ut(this,e):Vt(this.value,e);n.set(i)}),this.vm.after(this.forceUpdate,this)},update:function(t){var e=this.el,i=this.multi,s=this.desc.expression;if(e.selectedIndex=-1,i&&!n(t))return f("<select> cannot be multiple when the model set ["+s+"] as not Array");if(!i&&n(t))return f("The model ["+s+"] cannot set as Array when <select> has no multiple propperty");for(var r=e.options,o=0;o<r.length;o++){var h=r[o],u=h.value;h.selected=i?zt(u,t)>-1:u===a(t)}},forceUpdate:function(){this.update(this.directive.get())}},Re={bind:function(){var t=this.number,e=this.directive;this.on("change",function(){var i=e.get(),s=this.checked;if(r(i))e.set(s);else if(n(i)){var o=Vt(this.value,t),h=zt(o,i);s&&-1===h?i.push(o):h>-1&&i.splice(h,1)}})},update:function(t){var e=this.el,i=Vt(e.value,this.number);if(!n(t)&&!r(t))return f("Checkbox v-model value must be a type of Boolean or Array");e.checked=r(t)?t:zt(i,t)>-1}},qe=["input","select","textarea"],He=q(Mt);He.parse=function(){var t=this.el,e=this.desc,n=t.tagName.toLowerCase(),i="input"===n?Z(t,"type"):n;return qe.indexOf(n)<0?f("v-model only for using in "+qe.join(", ")):S(e.expression)?(e.duplex=!0,void this.bindDuplex(i)):f("v-model directive value can be use by static expression")},He.bindDuplex=function(t){var e,n=this.el;switch(t){case"text":case"password":case"textarea":e=ze,this.trim=J(n,"trim"),this.lazy=J(n,"lazy"),this.debounce=Z(n,"debounce");break;case"radio":e=Me;break;case"checkbox":e=Re;break;case"select":e=Fe,v(n,"__vmodel__",this),this.multi=J(n,"multiple"),this.forceUpdate=Fe.forceUpdate.bind(this)}if(!e)return f("Do not use incorrect form-type with v-model: ",n);this.number=J(n,"number"),this.update=e.update.bind(this),this.bind(),this.desc.once||e.bind.call(this)},He.on=function(t,e){tt(this.el,t,e,!1)},q(Ft).parse=function(){var t=this.desc,e=this.vm.$customs[t.args];if(!i(e))return f("Custom directive ["+t.attr+"] must define with a refresh function!");this.update=e,this.bind()};var Be={von:rt,vel:ot,vif:xt,vfor:gt,vtext:kt,vhtml:Ot,vshow:Nt,vbind:St,vmodel:Mt,vcustom:Ft},We=/\n/g,Ze=/\{\{(.+?)\}\}/g,Ge=/(\{\{.*\}\})/,Qe=["velse","vpre","vcloak","vonce","vhook"],Je=Qt.prototype;Je.mount=function(){this.$done=!1,this.$fragment=y(this.$element),this.compile(this.$fragment,!0)},Je.compile=function(t,e,n,i){var s=this,r=t.childNodes,o=!!i||qt(t);e&&Bt(t)&&this.$queue.push([t,n]),v(t,"__vonce__",o);for(var h=0;h<r.length;h++){var u=r[h],a=u.nodeType;if(1===a||3===a){var c=o||qt(u);Bt(u)&&(s.$queue.push([u,n]),v(u,"__vonce__",c)),u.hasChildNodes()&&!Ht(u)&&s.compile(u,!1,n,c)}}e&&this.compileAll()},Je.compileAll=function(){_(this.$queue,function(t){return this.compileNode(t),null},this),this.completed()},Je.compileNode=function(t){var e=t[0],n=t[1];if(H(e)){for(var i,s,r,o,h=[],u=e.attributes,a=0;a<u.length;a++){var c=u[a],l=c.name;Rt(l)&&("v-for"===l?i=c:"v-model"===l?(s=!0,o=h.length):0===l.indexOf("v-bind")?r=!0:0===l.indexOf("v-hook")&&Zt(e),h.push(c))}if(!i&&r&&s&&h.length>1&&o!==h.length-1){var f=h.splice(o,1)[0];h.push(f),f=null}i&&(v(e,"__dirs__",h.length),h=[i],i=null),_(h,function(t){this.parse(e,t,n)},this)}else B(e)&&this.parseText(e,n)},Je.parse=function(t,e,n){var i=t.__vonce__,s=Wt(e),r=s.directive,o="v"+r.substr(2),h=Be[o];if(G(t,s.attr),!(Qe.indexOf(o)>-1))if(h){s.once=i;var u=new h(this,t,s,n);i?u.destroy():n||this.$directives.push(u)}else f("["+r+"] is an unknown directive!")},Je.parseText=function(t,e){var n=[],i={},s=t.parentNode&&t.parentNode.__vonce__,r=t.textContent.trim().replace(We,""),o=r.split(Ze),h=r.match(Ze);_(o,function(t){h.indexOf("{{"+t+"}}")>-1?n.push("("+t+")"):t&&n.push('"'+t+'"')}),i.once=s,i.expression=n.join("+");var u=new Be.vtext(this,t,i,e);s?u.destroy():e||this.$directives.push(u)},Je.block=function(t){_(this.$queue,function(e){if(t===e[0])return null})},Je.after=function(t,e){this.$afters.push([t,e])},Je.completed=function(){0!==this.$queue.length||this.$done||(this.$done=!0,this.$element.appendChild(this.$fragment),delete this.$fragment,_(this.$afters,function(t){return t[0].call(t[1]),null}))},Je.destroy=function(){this.$data=null,W(this.$element),_(this.$directives,function(t){return t.destroy(),null})};var Ke=Jt.prototype;return Ke.mount=function(){this.__vm__.mount()},Ke.get=function(t){var e=this.$data;return s(t)?$(e,t):e},Ke.getCopy=function(t){return b(this.get(t))},Ke.set=function(t,n){var i=this.$data;s(t)?$(i,t,n):e(t)&&_(t,function(t,e){$(i,e,t)})},Ke.reset=function(t){var e=this.$data,i=b(this.__bk__);s(t)?e[t]=i[t]:n(t)?_(t,function(t){e[t]=i[t]}):_(e,function(t,n){e[n]=i[n]})},Ke.watch=function(t,e,n){return new M(this,{deep:n,expression:t},e.bind(this.__ct__))},Ke.destroy=function(){this.__vm__.destroy(),this.__vm__=this.__ct__=this.__bk__=this.$data=this.$els=null},Jt});

-接着在js文件中

console.log(language)//zh或者en
var lang = eval(language);
console.log(lang)//中文语言包或者英文语言包
if (lang != null) {
    var vm = new MVVM({
        'view': document.querySelector('#csDiv'),
        'model': lang
    });
};

-页面部分

  <div class="push-that-cover">
         {{releaseoriginal.Submit}}   <!-- {{}}内为语言包对象-->
  </div>

-语言包相关部分

var en = {
    ImgBox: {
        //品类一
        TypeOfOne: {
            fullview: "Overall view",
            drawwork: "Draw-work",
            mudpump: "Mud pump",
            mudtank: "Mud tank"
        }
}

如果页面加载时出现{{}}解决方案；

[v-cloak] {
    display: none;
 } //css 部分


 <div class="content zlb_content" id="app"  v-cloak></div>  //html部分
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。