毎日上走分システム開発

この命令は、毎日上走分システム開発(T:I 8 O-285 I-O 282)とそのサブ要素のコンパイルプロセスをスキップします.つまり、このノードとそのサブノードを静的ノードとして処理します.例えば、

    
{{message}}
  
    
{{message}}


    Vue.config.productionTip=false;
    Vue.config.devtools=false;
    var app = new Vue({
        el:'#app',
        data:{message:"Hello World"}
    })

コンパイルの結果は次のとおりです.
対応するHTMLノードツリーは次のとおりです.
title属性も特性として処理する、コンソールにappを入力する.message="Hello Vue!"レンダリングの変化を見てみましょう.
v-pre対応のDOMノードでは、データが変化してもレンダリングがトリガーされないことがわかります.
ソース分析
テンプレートの解析中にラベルの開始に遭遇するとstart関数が実行され、{{message}}に対して
start:function start(tag,attrs,unary){//9136行目ラベル開始時にここまで解析

  /* */

  if (!inVPre) {                            //  inVPre false  inVPre    ，         v-pre       ，  
123
   span                v-pre 
    processPre(element);                      //    v-pre  
    if (element.pre) {                        //  element v-pre  
      inVPre = true;                            //   inVPre true
    }
  }
  if (platformIsPreTag(element.tag)) {
    inPre = true;
  }
  if (inVPre) {                             //     pre    
    processRawAttrs(element);                  //   inPre true
  } else if (!element.processed) {          
    // structural directives
    processFor(element);                      //  v-pre         ，          ，      Vue   
    processIf(element);
    processOnce(element);
    // element-scope stuff
    processElement(element, options);
  }

  /* */
},

ProcessRawAttrsプロパティをASTオブジェクトのattrsプロパティに保存するには、次のようにします.
function processRawAttrs(//9317行目v-preプロパティが設定されている場合はvar l=el.attrsList.length;if(l){

var attrs = el.attrs = new Array(l); 
for (var i = 0; i < l; i++) {         //         ，     e.attrs  
  attrs[i] = {
    name: el.attrsList[i].name,
    value: JSON.stringify(el.attrsList[i].value)
  };
}

} else if (!el.pre) {

// non root node in pre blocks with no attributes
el.plain = true;

}}後でgendata()関数の実行時にattr属性にまとめられ、最後にrenderが対応するDOMノードにレンダリングされるとそのattr属性が対応するノードに保存され、例のテンプレートがrender関数にレンダリングされるのは以下の通りです.
with(this){return _c('div',{attrs:{"id":"app"}},[_c('p',{pre:true,attrs:{":title":"message"}},[_v("{{message}}")]),_v(""),_c('p',[_v(_s(message)])])}赤いマークがv-preコンパイルされたテンプレートです.p要素がリアルDOMノードにレンダリングされると、Vue内部のattrsモジュールのupdateAttrsメソッドがトリガーされて初期化され、v-bindコマンドの後のフローと同じように、最後にオリジナルのDOM関数setAttributeを呼び出して特性を設定します