智享笔记 Vue2
-
子组件向父组件传值
<body> <div id="app"> <div :style='{fontSize: fontSize + "px"}'>{{pmsg}}</div> <menu-item :parr='parr' @enlarge-text='handle'></menu-item> </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript"> /* 子组
-
父组件向子组件传值props属性值类型
<body> <div id="app"> <div>{{pmsg}}</div> <menu-item :pstr='pstr' :pnum='12' pboo='true' :parr='parr' :pobj='pobj'></menu-item> </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript"> /* 父组件向子组件传值-pro
-
父组件向子组件传值props命名规则
<body> <div id="app"> <div>{{pmsg}}</div> <!-- 在html中是短横行方式 --> <menu-item :menu-title='ptitle'></menu-item> </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript"> /* 父组件向子组件传值-props属性名规则 */ Vu
-
父组件向子组件传值的基本使用
<body> <div id="app"> <div>{{pmsg}}</div> <menu-item title='来自父组件的值'></menu-item> <menu-item :title='ptitle' content='hello'></menu-item> </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript
-
Vue调试工具测试
<head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .root { background-color: orange; } .second { background-color: lightgreen; } .third { background-color: lightblue; } </style></head><body> <div id="app" class="root">
-
局部组件用法
<body> <div id="app"> <hello-world></hello-world> <hello-tom></hello-tom> <hello-jerry></hello-jerry> <test-com></test-com> </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript"&