VUEJS：传递javascript按钮的值

我试图在单击按钮时将其值传递给函数。因为按钮是作为javascript元素创建的，所以我不知道该怎么做

    methods:{
      createButtons() {
        
        var i;
        var rows =["9","8","7","6","5","4","3","2","1","0","•","="];
        var elDiv = document.getElementById("myDIV");
        for (i=0; i<12; i++){ 
          var btn = document.createElement("BUTTON");
          btn.value = i
          btn.style.height = "40px"
          btn.textContent = rows[i];
          btn.onclick = buttonvalue;
          elDiv.appendChild(btn);  
        }
        var pressedbutton = document.getElementById("calculate");
        pressedbutton.remove();
      },
    }
  }

function buttonvalue(i){
  alert(i);
}

方法：{
createButtons（）{
var i；
风险值行=[“9”、“8”、“7”、“6”、“5”、“4”、“3”、“2”、“1”、“0”、“•”和“=”]；
var elDiv=document.getElementById（“myDIV”）；
对于（i=0；i这是一个XY问题。不要像这样手动创建DOM元素，这就是Vue的用途

但要回答您的问题，您可以这样做：

const captureI=i；
btn.onclick=（）=>按钮值（captureI）；

我将
I
复制到一个新的局部变量中，因为
I
通过
for
循环更改值

或者，您可以像这样编写
for
循环：

for（设i=0；i<12；i++）{
//…省略了代码。。。
btn.onclick=（）=>按钮值（i）；
}