密钥在触发后将 Promise 显示为一个值 ractive.set

Key is showing Promise as a value after firing ractive.set

我正在尝试使用 ractive.on 和 ractive.set 更改 JSON 对象中的值。基本上它会获取输入元素内的值(带有 ractive 变量),并在使用 on-click 事件按下锚元素后将它们分配给相应的键。它没有显示正确的值,而是显示 Promise。我附上了一张图片以供参考。

https://jsfiddle.net/clestcruz/L38tsud7/

<body>

  <div id='container'></div>

  <script id='template' type='text/ractive'>

      <p>Provide the company information for the:</p>

      <label>Company Name <span class="required">*</span></label>
      <input type="text" class="form-text full-width" placeholder="Enter the company name" id="accountName" value="{{leadData.accountName}}"/>



      <label>Street Name.</label>
      <input type="text" class="form-text" placeholder="-" id="streetName" value="{{leadData.streetName}}"/>

      <a class="button cta" on-click="addLead">Create Account</a>


  </script>

  <script src='http://cdn.ractivejs.org/latest/ractive.min.js'></script>

  <script>

      var app = new Ractive({
        el       : '#container',
        template : '#template',
    });

     var data = {
        'accountName'   : app.get('leadData.accountName'),
        'streetName'    : app.get('leadData.streetName'),
     }


      app.on('addLead', function(event) {
         var data = {
           'accountName'   : app.set('leadData.accountName'),
           'streetName'    : app.set('leadData.streetName'),
         }
         console.log(data);
      });

  </script>


</body>

您的意思可能是 app.get 而不是 app.set。此外,事件处理程序在实例的上下文中执行。这意味着您不需要使用外部变量(在本例中为 app)引用实例。您可以简单地使用 this.

app.on('addLead', function(event) {
  var data = {
    accountName: this.get('leadData.accountName'),
    streetName: this.get('leadData.streetName'),
  }
  // Do other stuff with data
});