3

ブートストラップ コンポーネントと共に、require.js を使用してバックボーンによってレンダリングされたページにラダ ボタンを配置しようとしています。しかし、私は

"Uncaught ReferenceError: Spinner is not defined".

元の ladda.js から縮小された spin.js を切り取り、同じディレクトリに配置します。

以下のようにシムド・ラダ：

require.config ({
   paths: {
            //jquery, underscore, backbone here
            spin : 'libs/ladda/spin',
            ladda: 'libs/ladda/ladda'
   },

   shim: {
        ladda: {
            deps: ['spin'],
            exports: 'Ladda'    
    }
}
});

バックボーン ビュー:

define([
  'jquery',
  'underscore',
  'backbone',
  'bootstrap',
  'spin',
  'ladda',
 ], function($, _, Backbone, Bootstrap, Spinner, ladda){
    render: function () {
        //templating

        console.log ('Spinner: ' + typeof Spinner);
        Ladda.create ($('button'));    
   }
});

関数であることがわかりtypeof Spinnerました。Spinner.name プロパティは「p」です。Spinner.name は "p" ではなく "Spinner" であるべきではありませんか? または「p」は縮小された変数から継承されますか?

Spinner を ladda.js のスコープ内で見えるようにするために見逃している他のステップは何ですか? アドバイスをいただければ幸いです。

ありがとうございました。

更新: Bass Jobsen のアドバイスのおかげで、 use hakimel committedspin.jsがSpinner読み込まれますが、エラーは引き続き発生します。Chrome Dev Tool コンソールの下:

クロム開発ツールのスクリーンショット

4

2 に答える 2

3

github.com/hakimel/Ladda/pull/7 に基づいて、spin.js を Ladda 自体のようなクラスに書き直しました。require の代わりに define を使用しました ( http://bardevblog.wordpress.com/2013/01/05/re-learning-backbone-js-require-js-and-amd/ )。スピナーもオブジェクトになりました。

Ladda.bind()うまくいかないようです（または、何を期待すべきかわかりません）。新しいボタン オブジェクトを作成できますLadda.create()。

参照: http://plnkr.co/edit/DuIVFP0UP8sSoek9gEZc

//https://github.com/requirejs/example-jquery-cdn   
requirejs.config({
    //"baseUrl": "js/lib",
    enforceDefine: true,
    "paths": {
      "app": "app",
      "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min",
      "spin": "spin",
      "ladda": "ladda"
    },
    shim: {
        "spin": {exports: "Spinner"},
        "ladda": {
            depends: "spin",
            exports: "Ladda"
        },



        }
});

// Load the main app module to start the app
requirejs(["app/main"]);

アプリ/main.js :

define(["jquery",'ladda','spin'], function($,ladda) {
    //the jquery.alpha.js and jquery.beta.js plugins have been loaded.
    $(function() {
      console.log("$: " + typeof $);
      console.log("ladda: " + typeof Ladda);
      console.log("spin: " + typeof Spinner);

      Ladda.bind($('button')[0]); //don't work ????????????
      //return;
      //Ladda.create('.ladda-button');
      var l = Ladda.create($('button')[1]);

    l.start();

// Will display a progress bar for 50% of the button width
l.setProgress( 5 );

// Stop loading
l.stop();

// Toggle between loading/not loading states
l.toggle();

// Check the current state
l.isLoading();


    });
});
于 2013-06-11T22:00:11.977 に答える
0

ladda小文字である必要はありませんl。これはrequire関数の引数の名前です。

ladda.create ($('button'));
于 2013-06-11T06:27:24.593 に答える