{"id":506,"date":"2020-02-26T16:53:16","date_gmt":"2020-02-26T08:53:16","guid":{"rendered":"https:\/\/blog.cqdefxxx.com\/?p=506"},"modified":"2020-02-26T16:53:16","modified_gmt":"2020-02-26T08:53:16","slug":"vue-todolist","status":"publish","type":"post","link":"https:\/\/blog.viter.top\/index.php\/2020\/02\/26\/vue-todolist\/","title":{"rendered":"Vue-todolist"},"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=\"description\" content=\"\"&gt;\n&lt;meta name=\"keywords\" content=\"\"&gt;\n&lt;link href=\"\" rel=\"stylesheet\"&gt;\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       &lt;input type=\"text\" v-model=\"mytext\"\/&gt;\n       &lt;button @click=\"handleClick()\"&gt;add&lt;\/button&gt; \n\n       &lt;ul&gt;\n          &lt;li v-for=\"item,index in datalist\"&gt;\n            {{item}}--&lt;button @click=\"handleDelClick(index)\"&gt;del&lt;\/button&gt;\n          &lt;\/li&gt;\n       &lt;\/ul&gt;\n    &lt;\/div&gt;\n\n    &lt;script type=\"text\/javascript\"&gt;\n        var vm = new Vue({\n           el:\"#box\",\n           data:{\n            mytext:\"1111\",\n            datalist:[]\n           },\n\n           methods:{\n            handleClick:function(){\n\n              this.datalist.push(this.mytext);\n            },\n\n            handleDelClick(index){\n              console.log(\"del-click\",index)\n\n              this.datalist.splice(index,1);\/\/\u5220\u9664\n            }\n           }\n        })\n\n        \/\/ \u65b0\u8001\u865a\u62dfdom\u5bf9\u6bd4\u7684 \u65f6\u5019 \u4f1a \u4f7f\u7528 diff \u7b97\u6cd5\u3002\n    &lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/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\/506"}],"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=506"}],"version-history":[{"count":0,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/506\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/media?parent=506"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/categories?post=506"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/tags?post=506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}