Question

我坚持“使用列表和集合”，需要帮助找到错误。删除按钮无效。

您可以在this codepen上查看我的资源。

    code

Answer 1

准确跟踪this是多么困难。最好在可能的情况下使用变量，并且this仅在您真正需要时使用。this。可以认为self表示代码应该可以与不同的提供的上下文一起重用。例如，如果您正在使用原型，这一点非常重要。（另请注意，绑定提供的上下文并不总是很明显。）

一种常见的技术是在构造函数中创建变量this，然后立即将其分配给this，然后使用它。这确保了无论上下文如何，函数调用都按预期运行。

revealing pattern是另一种最小化// KO WITH OBSERVABLEARRAY function mMember(name, gender) { this.name = name; this.gender = ko.observable(gender); } function vmMember() { var self = this; self.MemberGender = [{ gen: 'Male', tag: 'M' }, { gen: 'Female', tag: 'F' }]; self.members = ko.observableArray([ new mMember('Mark', this.MemberGender[0]), new mMember('Lester', this.MemberGender[0]) ]); self.add = function() { self.members.push(new mMember('', this.MemberGender[0])); }; self.remove = function(member) { self.members.remove(member); } } ko.applyBindings(new vmMember());曝光率的方式。

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<!-- OBSERVABLE ARRAY HERE -->

<button data-bind='click:add'>Add</button>

<table>

  <th>
    <tr>
      <td>Name</td>
      <td>Gender</td>
      <td>Initial</td>
    </tr>
  </th>

  <tbody data-bind='foreach:members'>
    <tr>
      <td>
        <input data-bind='value:name' />
      </td>
      <td>
        <select data-bind="options: $root.MemberGender, value: gender,optionsText: 'gen'"></select>
      </td>
      <td data-bind='text:gender().tag'></td>
      <td>
        <button data-bind='click:$root.remove'>x</button>
      </td>
    </tr>
  </tbody>
</table>

textbox

从observableArray中删除元素

1 个答案: