<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><div id="app"> <cpn :c-info="info"></cpn><!--使用驼峰标识的话需要使用- --></div><body><template id="cpn1"> <div> <h2>{{cInfo}}</h2><!--模板中允许使用驼峰标识--> </div></template><script src="vue.js"></script><script> // <!-- 用来实现三个组件合并--> const cpn={ template: '#cpn1', props:{ cInfo:{ /*使用驼峰标识*/ type:Object, default() { return {}; } } } }; const app=new Vue({ /*看成root组件*/ el:'#app', data:{ info:{ name:'why', age:19, height:22 } }, components:{ cpn } })</script></body></html>
来源:https://www.cnblogs.com/Damocless/p/11915246.html