小编jef*_*des的帖子

我正在尝试对组件方法进行单元测试。这里的问题并未提出如何从单元测试中访问组件方法。

具体来说，给定下面的Vue组件，如何doSomeWork()从单元测试中访问？

Vue组件：

<template>
    <div id="ThisStuff">
        <span>
            Some other stuff is going on here
        </span>
    </div>
</template>

<script>
    import foo from 'bar'

    export default {
        props: {
            ObjectWithStuffInIt: [
                {
                    id: 1
                    bar: false
                },
                {
                    id: 2
                    bar: false
                },
            ]
        },
        data: {
            foo: "foo"
        },
        methods: {
            doSomeWork: function() {
                for (var i = 0; i < ObjectWithStuffInIt.length; i++) { 
                    if (foo === "diddly") {
                        ObjectWithStuffInIt[i].bar = true;
                    }
                }
            }
        }
    } …

我有一张装满数据的表格。我selected对要绑定到 b 表中的复选框的数据有一个属性。我似乎无法弄清楚如何做到这一点。

我的数据：

data: () => ({
  tableData: [
    {
      title: "title01",
      desc: "desc01",
      selected: false
    },
    {
      title: "title02",
      desc: "desc02",
      selected: false
    },
  ],
  tableColumns: [
    { key: "selected", label: "", sortable: false }
    { key: "title", label: "Title", sortable: false },
    { key: "desc", label: "Description", sortable: false }
})

html：

<b-table id="myTabel"
  hover
  striped
  :items="tableData"
  :fields="tableColumns">
  <template slot="selected" slot-scope="row">
    <b-form-group>
      <input type="checkbox" v-model="How_To_Bind_To_Object_Prop?">
    </b-form-group>
  </template>
</b-table>

对于我的生活，我无法v-model设置实际绑定到表数据。 v-model="tableData.selected"将所有复选框绑定到所有数据对象。所以，如果你检查一个，你检查所有，反之亦然。我只是不知道如何将它绑定到该行的数据。

我可以通过使用更传统的 HTML …