感谢，工具很好！扩展组件，添加vue data变量在html页面报错！

[xujianhua]

根据 demo来改写的， 在根据demo来写的时候也提示变量没有定义。thx.

JS配置： { name: "date", icon: "fa fa-calendar", i18n: "date", /* show: true, init: function (editor) { console.log("time module init, config is \r\n" + JSON.stringify(this.config)) },*/ /handler: function (editor) { //editor.execCommand("insertHTML", moment().format(this.config.format || "YYYY-MM-DD HH:mm")) console.log('handler'); }, destroyed: function (editor) { console.log("time module destroyed") }/ //vue component dashboard: { template: "#template-date", data: function () { return { colors: [ '#000000', '#000033', '#000066', '#000099', '#003300', '#003333', '#003366', '#003399', '#006600', '#006633', '#009900', '#330000', '#330033', '#330066', '#333300', '#333366', '#660000', '#660033', '#663300', '#666600', '#666633', '#666666', '#666699', '#990000', '#990033', '#9900CC', '#996600', '#FFCC00', '#FFCCCC', '#FFCC99', '#FFFF00', '#FF9900', '#CCFFCC', '#CCFFFF', '#CCFF99' ] } }, methods: { changeColor(color){ this.$parent.execCommand(this.command, color) } }, created(){ debugger; const config = this.$options.module.config // font name if (!config) { return } if (Array.isArray(config.fontNames)) { this.nameList = config.fontNames } } } }

前台页面：

报错信息： [Vue warn]: Error compiling template:

 		<div v-for="color in colors" :style="{'background-color':color}" class="color-card" @click="changeColor(color)">
    	</div>

• Cannot use v-for on stateful component root element because it renders multiple elements.

found in

---> <DashboardDate> <VueHtml5Editor> <TargetAdd> at D:\Project\JAVA\ddyFront\src\components\target\add.vue <App> at D:\Project\JAVA\ddyFront\src\App.vue <Root>

[Vue warn]: Multiple root nodes returned from render function. Render function should return a single root node.

found in

---> <DashboardDate> <VueHtml5Editor> <TargetAdd> at D:\Project\JAVA\ddyFront\src\components\target\add.vue <App> at D:\Project\JAVA\ddyFront\src\App.vue <Root>