【问题标题】:Helper functions in jsviewsjsviews 中的辅助函数
【发布时间】:2016-09-07 07:49:18
【问题描述】:

我正在浏览 JsViews 站点中的以下示例以获取按钮 http://www.jsviews.com/#link-button。当我修改代码以获取输入并在单击按钮时在警报框中显示相同内容时,辅助函数将在加载时执行。此外,不是单击按钮,而是在输入值更改时执行该函数。我猜测,由于视图中的模型值发生了更改,因此使用更新的模型值调用了该函数,但是为什么单击按钮时它不起作用。我对 jsviews 很陌生,无法理解正在发生的事情。谁能告诉我我的方法有什么问题。以下是更新后的代码。

<div id="topLinked">
<input type="text" data-link="test"/>
 <button data-link="{on ~doSomething(test)}">Do something</button>
<input type="button" data-link="{on ~doSomething(test)}" value="Do something" />
           </div>  

  var person = {};

var helpers = {
  doSomething: function(val) {
    alert(val);
  }
}

$.link(true, "#topLinked", person, helpers); // Data-link top-level content

【问题讨论】:

    标签: javascript jquery jsrender jsviews


    【解决方案1】:

    你犯了一个错误:data-link="{on ~doSomething(test)}"。 参数通过一个或多个空格传递,如下所示:data-link="{on ~doSomething test test2 ...}"

    我像这样更改了example

    html

    <div id="result"></div>
    
    <script id="tmpl" type="text/x-jsrender">
      <input type="text" data-link="test" value="Do something" />
      {^{on ~doSomething test}}Do something{{/on}}
      <button data-link="{on ~doSomething test}">Do something</button>
      <input type="button" data-link="{on ~doSomething test}" value="Do something" />
    </script>
    

    js

    var person = {
        test : "start value"
    };
    
    var helpers = {
        doSomething : function (val) {
            alert(val);
            return false;
        }
    }
    
    var tmpl = $.templates("#tmpl");
    tmpl.link("#result", person, helpers);
    

    jsfiddle 上的示例

    【讨论】:

    • 非常感谢。 jsviews.com/#helpers 中有几个语法错误的示例。这是过时的还是用于不同场景的用法。
    • @user1776573 这不是错误,而是功能!这对于 jsrender 是正确的,但对于 jsviews 来说并不完全正确。只需要知道~doSomething(test) 在模板渲染时执行了什么,~doSomething test 在适当的事件中完成。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-10-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-04
    • 1970-01-01
    相关资源
    最近更新 更多