vue踩过的坑

Improt

• vue组件在引用js的时候，有可能会引用不到，就算打了debugger也看不出来实际的问题，然鹅，当你去控制台console.log打印的时候实际上你引用的对象是有值的，造成双向绑定出问题，这时候的解决方式是在method()里面定义一个方法func()，在方法里面都给目标对象赋值，然后在mouted()里面调用一下，神奇的可以了

v-for

• 有时候，v-for的key值不能当成唯一标识，直接上代码吧
  当使用splice删除某一行时，会出现渲染错误

<tr v-for="(item,key) in formItem.listXgmResAttributeKey" :key="key">
	<td>
		<FormItem	:label-width="0">
			 <Select v-model="item.labelId" filterable transfer @on-change="selectLabelName($event,key)">
				<Option v-for="(option_item,option_key) in item.labelNameData" :value="option_item.definitionId" :key="option_key">
				 {{ option_item.definitionName }}</Option>
			</Select>
		</FormItem>
	</td>
	<td>
		<FormItem	:label-width="0">
			<CheckboxGroup v-model="item.labelValueId">
				<Row>
					<Col span="4" v-for="(checkbox_item,checkbox_key) in item.labelValueData" :key="checkbox_item.definitionName">
					<Checkbox class="w150 ellipsis"  :title="checkbox_item.definitionName" :disabled="bankInReadOnly" :label="checkbox_item.definitionId">{{checkbox_item.definitionName}}</Checkbox>
					</Col>
				</Row>
			</CheckboxGroup>
			</td>
</tr>

watch周期函数

当你在组件的watch里面监听一个对象的时候，很可能会因为页面其他输入框数据改变而影响到你的组件监听，导致监听不断的触发，涉及到vue的底层原理，具体原因未知，解决的方法是利用双向绑定，在data里面定义变量，然后在create里面赋值