工作笔记--vue相关（一）

1.使用vue和elementui做一个复选框

代码如下

<li v-for="item in totalBars['subitem']" v-if="!item.url" class="normal-show-text">   <el-checkbox class="checked-text" v-model="item.isBeChecked" @change.native.stop="changeChecked(item.number,totalBars['file_name'])"></el-checkbox> <div class="checked-text-info">     <b>{{item.number}}</b>     <strong>【{{item.title}}】</strong><br/>     <em :title="item.remarks">{{item.remarks}}</em> </div>                                      </li>

需要注意的两点，复选框是否选中用v-model，点击复选框使用@change

2.@import的路径问题

如下所示，在exportDwg.vue中引用

<style>@import "../../styles/exportDwg.styl";</style>

exportDwg.vue和exportDwg.styl的位置关系如下所示

3.src路径问题

“url”:”vm/src/components/exportDwg/imgexportdwg/standard-layer/test.jpg”

4.vue什么时候使用.native(见文档)

有时候，你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on 的修饰符 .native。例如：

<my-component v-on:click.native="doTheThing"></my-component>

所谓原生就类似于你直接用

$element.addEventListener(click, callback);

绑定事件。
my-component会阻止click事件，你可以试试只用click不用native,事件是不会触发的。而普通的html元素如a标签不会阻止。