Question

因此，我有一个名为TitleForm的组件，其中包含一个输入和一个按钮，而我想要的是每当我单击按钮以将attr值设置为空白时。但是，每当我尝试得到错误Method "resetValue" has type "object" in the component definition. Did you reference the function correctly?

TitleForm有一个属性，因此可以在需要时将输入值设置为特定值。

<template lang="html">
  <div class="title-form">
    <input type="text" id="title" :value="value" placeholder="Enter title" autocomplete="off">
    <div class="buttons">
    <button @click="resetValue" id="delete-button"></button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'TitleForm',
  props: {
    value: String
  },
  methods: {
    resetValue: {
      function() {
        document.getElementById('title').value = '';
      }
    }
  }
}
</script>

Answer 1

您将函数放入对象中。按照声明的方式，您的onclick事件正在尝试将resetValue当作不起作用的对象来调用。

methods: {
    resetValue: {
       function() {
          document.getElementById('title').value = '';
       }
    }
}

相反，请删除花括号并将resetValue声明为一个函数：

methods: {
    resetValue: function() {
        document.getElementById('title').value = '';
    }
}

Answer 2

尝试

methods: {
    resetValue(){
        document.getElementById('title').value = '';
    }
}

如何在vue.js onclick中更改输入标签的value属性？

2 个答案: