vue在methods修改data的数据,vue中data函数
本文主要介绍了Vue中数据调用方法的实现，具有很好的参考价值，希望对大家有所帮助。如有错误或不足之处，请不吝赐教。
目录
今天用了Element的一个组件。该组件的代码如下。下面这个页面的渲染效果如下。如果要向表中添加按钮事件。
今天我用到了Element的一个组件
如下：
其组件的代码如下
//模板内容：
模板
差异
el表
:data=tableData
style= width:100%；下边距：20px
row-key=id
边界
默认-展开-全部
:tree-props= { children: children ，hasChildren: hasChildren }
El-table-column prop= date label= date sortable width= 180
/El-表格-列
El-table-column prop= name label= name sortable width= 180
/El-表格-列
El-表格列属性=地址标签=地址/El-表格列
/el-table
/div
/模板
//数据数据内容
表格数据：[
{
id: 1，
日期：“2016年5月2日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1518弄”，
},
{
id: 2，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
儿童：[
{
id: 21，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
},
],
},
],
如果想在表格中添加按钮，可以添加(Element的表格组件可以添加元素标签，直接写在空白对应的表格中即可)。代码如下：
//只改变数据的内容。
{
id: 2，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
孩子：[{
id: 21，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址： (
El按钮类型=“主要”普通确认/el按钮
),
}]
}
页面渲染的效果如下
注意，在这个地方，如果要给里面的按钮添加事件，不能直接给按钮添加@click或者onclick。以这种方式添加按钮事件会导致错误。效果如下：
//首先，添加@click的方法
{
id: 2，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
孩子：[{
id: 21，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址： (
El-button type= primary plain @ click= show me()确认/el-button
),
}],
}
1.如果使用@click方法，代码块中将显示一条错误消息：
2.如果使用onclick方法，代码块不会报告错误，错误会显示在页面呈现的控制台上：
//使用的onclick方法如下：
{
id: 2，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
孩子：[{
id: 21，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址： (
El-button type= primary plain onclick= show me 确认/el-button
),
}]
}
效果如下：
如果想要在表格里面添加按钮事件的话
代码如下：
{
id: 2，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址：“上海市普陀区金沙江路1519弄”，
孩子：[{
id: 21，
日期：“2016年5月1日”，
姓名：“王小虎”，
地址： (
El-button type= primary plain onclick={()=this . show me()}确认/el-button
),
}]
}
这种在数据上加nclick={() = this.函数名()}是不会出错的。
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。