title: vue.js:465 [Vue warn]: Failed to generate render function:
body: <p><strong>I got an error like this:</strong></p>
  
  <pre><code>vue.js:465 [Vue warn]: Failed to generate render function:
  
  ReferenceError: Invalid left-hand side in assignment in
  
  with(this){return _c('div',{attrs:{"id":"test"}},[_c('p',[_v(_s(_f("sum 4")(message)))]),_v(" "),_c('p',[_v(_s(_f("cal 10 20 10")(message)))]),_v(" "),_c('input',{directives:[{name:"model",rawName:"v-model",value:(message | change),expression:"message | change"}],attrs:{"type":"text"},domProps:{"value":(message | change)},on:{"input":function($event){if($event.target.composing)return;message | change=$event.target.value}}})])}
  </code></pre>
  
  <p><strong>This is my HTML file:</strong></p>
  
  <pre><code>(found in &lt;Root&gt;)
  
     &lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;title&gt;vue&lt;/title&gt;
          &lt;script src="D:\library\vue.js"&gt;&lt;/script&gt;
          &lt;meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="test"&gt;
              &lt;p&gt;{{ message | sum 4 }}&lt;/p&gt;
              &lt;p&gt;{{ message | cal 10 20 10 }}&lt;/p&gt;  
  
              &lt;input type="text" v-model="message | change"&gt; 
  
          &lt;/div&gt;
          &lt;script type="text/javascript"&gt;
  
  //        -----------------------------------------model-&gt;view---------------------------------------
              Vue.filter("sum", function(value) {   
                  return value + 4;
              });
  
              Vue.filter('cal', function (value, begin, xing) {   
                  return value + begin + xing;
              });
  
  //        -----------------------------------------view-&gt;model---------------------------------------
              Vue.filter("change", {
                  read: function (value) { 
                      return value;
                  },
                  write: function (newVal,oldVal) { 
                      console.log("newVal:"+newVal); 
                      console.log("oldVal:"+oldVal);
                      return newVal;
                  }
              });
  
              var myVue = new Vue({
                  el: "#test",
                  data: {
                      message:12
                  }
              });
  
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>I learn vue.js these days,and I found it funny.but this is a big mistake that make me headache......Is there any grammar mistakes?How can I do for this mistake? And what's the meaning of the error? Thank you very much.</strong></p>