程序员经验分享-hwhale

ember Uncaught TypeError：在存储中加载时，未定义不是一个函数

2024-01-10

我正在使用 ember 来显示从我的 golang 服务器收到的数据。数据采用 JSON 形式。 所以我打开了一个 websocket 并尝试推送在商店中收到的消息，但我收到了此错误： 未捕获的类型错误：未定义不是函数

这是我的 app.js：

    App = Ember.Application.create({
  LOG_TRANSITIONS: true

})
/******************************* Post Template **************************************/

//Define a route for the template "post"
App.Router.map(function() {
  this.route("post", { path: "/post" });

});

//Post Model
App.Post = DS.Model.extend({
     name: DS.attr('string' ),
     number: DS.attr('string')
});


DS.SocketAdapterMixin = Ember.Mixin.create({
    uri: 'ws://localhost:8081/',
    init: function(){
        this.ws = new WebSocket(this.uri);

        // callbacks
        this.ws.onopen = function() {
          console.log('Connection established /all');
        };
        this.ws.onclone = function() {
          console.log('Connection closed /' + 'all');
        };
        this.ws.onmessage = function(data) {

         this.get('store').load(App.Post, data)
          console.log(data);

        };

        this._super();
    },

    initialize: function() {
        console.log('SocketAdapterMixin::initialize');
        this._super();
  }
});


DS.SocketAdapter = DS.RESTAdapter.extend(DS.SocketAdapterMixin, {
  init: function() {
    this._super();
    console.log('SocketAdapter');
  }

});

App.ApplicationAdapter = DS.SocketAdapter.extend({});

// Use the adapter in the store

App.Store = DS.Store.extend({
  revision: 13,
  adapter: DS.SocketAdapter.create({})
});

和我的index.html：

  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
    <title>Ember.js Example Application</title>

   <script src="js/libs/jquery-1.10.2.js"></script>
   <script src="js/libs/handlebars-1.1.2.js"></script>
   <script src="js/libs/ember-1.5.1.js"></script>
   <script src="js/libs/Ember_Data.js"></script>
   <script src="js/app.js"></script>
   <script src="js/router.js"></script>
 <!--  <script src="js/models/model.js"></script> -->

</head>
<body>
<h1>Bonjour </h1>


<script type="text/x-handlebars">
    Hello, {{firstName}} {{lastName}}<br/>

    <nav>
  {{#link-to 'post'}}Post{{/link-to}}
  </nav>

     <div>
      {{outlet}}
    </div>

</script>



<script type="text/x-handlebars" data-template-name="index">
    <h2>My Wrappers</h2>
    <ul>
    {{#each post in model}}
        <li>{{post.number}}</li>

    {{/each}}
    </ul>
  </script></p>


  <script type="text/x-handlebars" data-template-name="post">
     <h2>My Post</h2>
    <ul>
        <li> Zied</li>
        <li> Farah</li>
    </ul>
  </script>


<script type="text/javascript">

</script>


</head>
<body>
</body>
</html>

我建议问题出在 this.get('store') 中，当我尝试打印它的值时，它会打印 undefined 。


自 Ember Data 1.0 beta 1+ 以来，您不再在 Ember Data 中定义存储。

App.Store = DS.Store.extend({ revision: 13, adapter: DS.SocketAdapter.create({}) });

只需使用这个就足够了：

App.ApplicationAdapter = DS.SocketAdapter;

该商店被传递到find功能，如果你想要的话可​​以使用它。此外，您将超出范围内onmessage，但这不是重点。

推荐

由于您的程序有两个部分，我建议使用依赖项注入创建适配器/传输层。这是一个粗略的草稿

运输

DS.SocketTransport = Ember.Object.extend({
    uri: 'ws://localhost:8081/',
    type: 'post',
    ws: null,
    store: null,
    init: function(){
        var uri = this.get('uri'),
            type = this.get('type'),
            store = this.get('store'),
            ws = new WebSocket(uri);

        // callbacks
        ws.onopen = function() {
          console.log('Connection established /all');
        };
        ws.onclone = function() {
          console.log('Connection closed /' + 'all');
        };
        ws.onmessage = function(data) {
          // if this is random post data, side load
          store.load('post', data)
          console.log(data);
        };

        this._super();
    }
});

网络套接字适配器

App.MyWsAdapter = DS.RESTAdapter.extend({
  transport: null,
  find: function(store, type, id) {
    var transport = this.get('transport');
    // Do your thing here
    return new Ember.RSVP.Promise(function(resolve, reject){
      // use the transport here to send a message/get a message, containing
      // the json for the type and id mentioned above then use
      //resolve(json);
    });

  },

});

依赖注入

App.initializer({
    name: "transport",
    after:['store'],

    initialize: function (container, application) {
      var store = container.lookup('store:main'),
          postTransport = application.PostTransport.create({store:store, type:'post'});

        register("my:postTranspot", postTransport);
        application.PostAdapter = App.MyWsAdapter.create({
          transport: postTransport
        });
    }
});
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

emberjs

WebSocket

Store

ember Uncaught TypeError：在存储中加载时，未定义不是一个函数 的相关文章

随机推荐

热门标签