{"id":510,"date":"2020-02-26T16:56:46","date_gmt":"2020-02-26T08:56:46","guid":{"rendered":"https:\/\/blog.cqdefxxx.com\/?p=510"},"modified":"2020-02-26T16:56:46","modified_gmt":"2020-02-26T08:56:46","slug":"vue-class%e4%b8%8estyle%e5%8a%a8%e6%80%81%e5%8f%98%e5%8c%96","status":"publish","type":"post","link":"https:\/\/blog.viter.top\/index.php\/2020\/02\/26\/vue-class%e4%b8%8estyle%e5%8a%a8%e6%80%81%e5%8f%98%e5%8c%96\/","title":{"rendered":"Vue-class\u4e0estyle\u52a8\u6001\u53d8\u5316"},"content":{"rendered":"
<!DOCTYPE html>\n<html>\n<head>\n<meta charset=\"utf-8\">\n<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\">\n<title>Examples<\/title>\n<meta name=\"description\" content=\"\">\n<meta name=\"keywords\" content=\"\">\n<link href=\"\" rel=\"stylesheet\">\n\n<script type=\"text\/javascript\" src=\"lib\/vue.js\"><\/script>\n\n<style>\n  \n\n   .red {\n    background-color: red;\n   }\n\n   .yellow{\n    background-color: yellow;\n   }\n   .aaa{\n\n   }\n\n   .bbb{\n\n   }\n<\/style>\n<\/head>\n<body>\n    <div id=\"box\">\n        <button @click=\"handleClick()\">change<\/button>\n        <div :class=\"classobj\">\n          \u6211\u662f\u52a8\u6001\u5207\u6362class- \u5bf9\u8c61\u5199\u6cd5\n        <\/div>\n        <div :class=\"classarr\">\n          \u6211\u662f\u52a8\u6001\u5207\u6362class- \u6570\u7ec4\u5199\u6cd5\n        <\/div>\n\n\n        <div style=\"background: red\">\u6211\u662f\u9759\u6001\u7684style<\/div>\n\n        <div :style=\"styleobj\">\u6211\u662f\u52a8\u6001\u5207\u6362style--\u5bf9\u8c61\u5199\u6cd5<\/div>\n\n        <div :style=\"stylearr\">\u6211\u662f\u52a8\u6001\u5207\u6362style--\u6570\u7ec4\u5199\u6cd5<\/div>\n    <\/div>\n\n    <script type=\"text\/javascript\">\n    \t\n    \tvar vm = new Vue({\n    \t\tel:\"#box\",\n        data:{\n         \n          classobj:{\n            \"a\":true,\n            \"b\":true,\n            \"c\":false\n          },\n\n          styleobj:{\n            background:'red',\n            fontSize:'30px'\n          },\n\n          classarr:[\"a\"],\n          stylearr:[{background:'yellow'}]\n        },\n\n        methods:{\n          \n        }\n        \n       }) \n      \/\/ Vue.set(vm.classObj,\"dd\",true);\n      \/\/ .style.fontSize=\"30px\";\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
<!DOCTYPE html> <html> <head> <meta charset= …<\/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\/510"}],"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=510"}],"version-history":[{"count":0,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/510\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/media?parent=510"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/categories?post=510"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/tags?post=510"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}