Question

如何在构造中访问ReactiveVar，如下所示？

Template.profile.helpers({
    user: {
        ...
        gender: () => Template.instance().genderFlag.get(), //returns Uncaught TypeError: Cannot read property 'genderFlag' of null
        ...
    },
});

返回error，因为Template.instance()中的gender:为null（当我console.log(Template.instance());时）

这是我创建ReactiveVar的方式：

Template.profile.onCreated( function() {
  this.genderFlag = new ReactiveVar(0);
});

P.S。 gender位于user内，因为我在.html中使用了user个上下文，即{{#with user}}。

更新

Spacebars part：

<button type="button" name="Male" class="{{#if gender '1'}}gender--selected{{/if}}">Male</button>
<button type="button" name="Female" class="{{#if gender '2'}}gender--selected{{/if}}">Female</button>

所以我将arg传递给Template.helper gender：

user: {
   ...
   gender: (arg) => arg == Template.instance().genderFlag.get(),
   ...
}

Answer 1

因为你在帮助器中创建了一个函数，它似乎正在拾取错误的数据上下文，因此当调用它时，Template变量不可用，下面的代码可以工作，它将函数移动到帮助器本身所以上下文是正确的，它可以正确访问Template.instance()，然后您可以根据需要为#with

返回用户的对象

Template.profile.helpers({
  user: () => { 
    return { 
        ...
        gender: Template.instance().genderFlag.get() 
        ...
    };
  }
});

编辑：

根据您的问题的更新，我想说的几个选项是：

Template.profile.helpers({
  user: () => { 
    var gend = Template.instance().genderFlag.get();
    return { 
        ...
        gender: gend,
        isMale: gend===1?"gender--selected":"",
        isFemale: gend===2?"gender--selected":"",
        ...
    };
  }
});

在你的把手中

<button type="button" name="Male" class="{{isMale}}">Male</button> 
<button type="button" name="Female" class="{{isFemale}}">Female</button>

从帮助程序（间接）访问ReactiveVar // Template.instance（）

1 个答案: