{"id":517,"date":"2020-02-26T20:48:10","date_gmt":"2020-02-26T12:48:10","guid":{"rendered":"https:\/\/blog.cqdefxxx.com\/?p=517"},"modified":"2020-02-26T20:48:10","modified_gmt":"2020-02-26T12:48:10","slug":"vue-%e5%88%97%e8%a1%a8%e6%b8%b2%e6%9f%93-%e8%bf%87%e6%bb%a4%e5%ba%94%e7%94%a8","status":"publish","type":"post","link":"https:\/\/blog.viter.top\/index.php\/2020\/02\/26\/vue-%e5%88%97%e8%a1%a8%e6%b8%b2%e6%9f%93-%e8%bf%87%e6%bb%a4%e5%ba%94%e7%94%a8\/","title":{"rendered":"Vue-\u5217\u8868\u6e32\u67d3-\u8fc7\u6ee4\u5e94\u7528"},"content":{"rendered":"<pre class=\"pure-highlightjs\"><code class=\"\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n&lt;meta charset=\"utf-8\"&gt;\n&lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\"&gt;\n&lt;title&gt;Examples&lt;\/title&gt;\n&lt;meta name=\"keywords\" content=\"\"&gt;\n&lt;link href=\"\" rel=\"stylesheet\"&gt;\n\n&lt;script type=\"text\/javascript\" src=\"lib\/vue.js\"&gt;&lt;\/script&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n    &lt;div id=\"box\"&gt;\n\n    \t&lt;input type=\"text\" v-model=\"mytext\" @input=\"handleInput()\"\/&gt;\n        \n&lt;!--         &lt;ul&gt;\n            &lt;li v-for=\"data in datalist\" :key=\"data\"&gt;\n                {{data}}\n            &lt;\/li&gt;\n        &lt;\/ul&gt; --&gt;\n\n\n        &lt;ul&gt;\n            &lt;li v-for=\"data in computedDatalist\" :key=\"data\"&gt;\n                {{data}}\n            &lt;\/li&gt;\n        &lt;\/ul&gt;\n    &lt;\/div&gt;\n\n    &lt;script type=\"text\/javascript\"&gt;\n            \n        \n        var vm = new Vue({\n            el:\"#box\",\n            data:{\n                datalist:[\"aaa\",\"bbb\",\"ccc\",\"ddd\",\"add\",\"cee\",\"eee\"],\n                \/\/ list:[\"aaa\",\"bbb\",\"ccc\",\"ddd\",\"add\",\"cee\",\"eee\"],\n                mytext:\"\"\n            },\n\n            methods:{\n                \/\/ handleInput(){\n                \/\/     console.log(this.mytext);\n                \/\/     \/\/filter ES5\n                    \n                \/\/     this.datalist = this.list.filter((item)=&gt;item.indexOf(this.mytext)&gt;-1);\n                \/\/ }\n            },\n\n            computed:{\n                computedDatalist(){\n                    return this.datalist.filter((item)=&gt;item.indexOf(this.mytext)&gt;-1);\n                }\n            }\n\n        })\n\n\n            \/\/\u8ba1\u7b97\u5c5e\u6027 \u57fa\u4e8e\u4f9d\u8d56\u91cd\u65b0\u8ba1\u7b97\uff0c\u7528\u5728v-for\n            \/\/filter \u4e0d\u5f71\u54cd\u539f\u6570\u7ec4\n\n            var arr = [\"aaa\",\"bab\",\"ccc\"]\n\n            var newarr = arr.filter((item)=&gt;item.indexOf(\"a\")&gt;-1);\n\n            console.log(newarr,arr);\n    &lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n\n<\/code><\/pre>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset= &#8230;<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[9,10],"_links":{"self":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/517"}],"collection":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/comments?post=517"}],"version-history":[{"count":0,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/517\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/media?parent=517"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/categories?post=517"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/tags?post=517"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}