基于我的代码如果一定要使用innerHTML方法,向表格中增加可以触发m2函数的按钮,该怎么做
时间: 2024-02-13 19:59:46 浏览: 28
如果一定要使用innerHTML方法,可以将按钮的点击事件绑定到全局作用域下的函数上,在该函数中调用Vue实例中的m2方法。具体代码如下:
```
var htmlTableDataCellElement1 = document.createElement("td");
htmlTableDataCellElement1.innerHTML = "<input type=\"button\" value=\"删除\" onclick=\"deleteRow()\">";
var htmlTableRowElement = document.createElement("tr");
htmlTableRowElement.id = this.deleteId;
htmlTableRowElement.appendChild(htmlTableDataCellElement);
htmlTableRowElement.appendChild(htmlTableDataCellElement1);
var elementById = document.getElementById("123");
elementById.appendChild(htmlTableRowElement);
function deleteRow() {
var vueInstance = document.querySelector('#wer').__vue__;
vueInstance.m2();
}
```
这里将按钮的点击事件绑定到了`deleteRow()`函数上,在该函数内部获取Vue实例并调用其m2方法。注意,要使用`__vue__`属性来获取Vue实例,而不是直接将Vue实例绑定到全局作用域下。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)