按钮上的事件在 vue-datatable 中不起作用

Question

我正在使用vue datatable，除了在单击按钮时不调用 callmethod() 之外，其他功能都可以正常工作。当我单击按钮时，不会触发任何事件。请有任何建议。

export default{
  
        data(){
          return{
            columns: [
                        {label: 'name', field: 'name'},
                        {label: 'Link', representedAs: row => ` <button @click="callmethod(${row.id})"> </button>`, interpolate: true}, 
                        
                       
                    ],
                rows: [],
                page: 1,
                per_page: 10,
                filter:  '',
           }
        },
        methods:{
          callmethod()
          {
            console.log('function called');
          },

Answer 1

编辑：看起来您实际上正在使用vuejs-datatable。尽管如此，那里只存在原始数据，没有像回调那样的东西，所以在那里应该不可能做到这一点。尝试以某种方式直接在您的模板中执行此操作，因为官方文档中没有任何内容在谈论这个。

或者也许看看另一个允许你这样做的库。有很多，你想要做的事情可能会更容易使用另一个包。您当前使用的那个 (vuejs-datatable) 只有 147 颗星，所以不是最受欢迎的。我建议在这里查看所有可用的解决方案：https://github.com/vuejs/awesome-vue#table

您可以像这样看到附加的侦听器，从您的 vue devtools 中选择组件，然后在控制台中检查它的侦听器。

---

您是在谈论 Vuetify 的 v-data-table 还是另一个？因为周围有很多..

另外，从官方#data 文档中，我们可以看到它说

经验法则是数据应该只是数据 - 不建议观察具有自己状态行为的对象。

到目前为止，您不应将任何类型的 @click 事件处理到 data 中。您确定您的图书馆打算以这种方式工作吗？