1

我在 RactiveJS 中使用 Pikaday 日期选择器作为装饰器，并希望在装饰器之外访问日期选择器的 api，但将其添加到返回对象似乎不起作用。有人可以指出我正确的方向吗？

http://jsbin.com/lefiyume/1/edit?html,js

4

2 回答 2

4

装饰器被设计为 Ractive 和外部库之间可重用的桥梁——所以与其拥有一个startdate装饰器和一个enddate装饰器，不如拥有一个pikaday装饰器。

然后装饰器函数负责管理自己的状态并与 Ractive 实例交互。如果您发现自己试图获取对装饰器创建的对象（即 Pikaday 实例）的引用，这通常是一个危险信号。

这是您可以做到的一种方法：http: //jsbin.com/susev/5/edit ?html,js,output

在此示例中，我们将键路径传递给装饰器的两个实例。当pikadayDecorator使用每个节点调用该函数时<input>，它会使用两个参数调用 - 节点和键路径。（您可以有其他参数 - 只需用逗号分隔它们。）

然后装饰器可以设置双向绑定 - 它观察给定的键路径（例如startdateor enddate）并在 Pikaday 实例setDate()更改时调用它的方法。我们还使用该onSelect()方法在选定的日期更改时更新RACTIVE的模型 - 这意味着我们可以使用模板中其他位置的日期，甚至可以使用ractive实例之外的日期：

ractive.observe('startdate', function (newDate) {
  // This may have been as a result of a `ractive.set()`, or
  // because the user interacted with the datepicker
  console.log('startdate changed to', newDate);
});

（请注意，Pikaday 会自动将像 '2015-01-01' 这样的字符串转换为日期对象。）

在 docs 上有更多关于创建装饰器的信息。

于 2014-04-24T14:39:23.670 回答
0

您需要setDate在 saleEndDecorator 函数内部调用。

http://jsbin.com/lefiyume/7/edit

于 2014-04-24T14:26:43.413 回答