Vue.js错误:无法读取undefined(...)

时间:2016-12-07 15:35:08

标签: vue.js vue-component vue-router

我正在尝试使用Vue.js全局事件总线。这是我的代码。我检查了很多工作正常的例子,但是当我尝试使用相同的想法为我的项目编码时,它显示了这个错误:

  

无法读取undefined(...)

的属性'_parent'
var bus = new Vue()

 Vue.component('login', {
  template: "#login",
  data: function(){
    return {
        ip:'',
        sessiontoken:''
    }
 },

ready: function(){  
    this.settoken();
    this.getip();      
  }, 

methods: {

    getencrypteduser:function(){                  
        },

    getauthentifications: function(event){
        this.$http.get('http://example.com/application/authentification', function(response){

          console.log(response);    

        }, {headers:{'Accept' : 'json',
                    'Content-Type' : 'application/hal+json',
                    'Authorization' : 'Basic ' + window.btoa(this.user+':'+this.password)}
            }); 

        bus.$emit('createauthentification')

    }
}
 })


 Vue.component('register', {
  template: "#register",
  data: function(){
    return {
        ip:'',
        sessiontoken:''
    }
},

ready: function(){  
    this.settoken();
    this.getip();     
},

methods: {

    getencrypteduser:function(){                  
        },
    created: function(){
        bus.$on('createauthentification', function(event){

            console.log(moment().format('LLLL'));   

            var data = {
                '_links':{
                    'type' : {
                        'href' : 'http://example.com/rest/type/node/authenfication'
                    }
                },
                'title':[
                    {
                        'value' : 'cccccccc'
                    }
                ],
                'field_id':[
                    {
                        'value' : this.$cookie.get('test')
                    }
                ],
                'field_ip':[
                    {
                        'value' : this.ip
                    }
                ],
                'field_va':[
                    {
                        'value' : 'Basic ' + window.btoa(this.user+':'+this.password)
                    }
                ],
                'field_expiration':[
                    {
                        'value' :  '2016-08-01T14:30:00'
                    }
                ]
            }

            this.$http.post('http://example.com/entity/node?_format=hal_json', data, function(response){
                console.log(response);
                this.$set('success', 'ok');
                this.$route.router.go('/');

            },  { headers:{ 'Accept' : 'json',
                            'Content-Type' : 'application/hal+json',
                            'Authorization' : 'Basic ' + window.btoa(this.user+':'+this.password),
                            'X-CSRF-Token': this.sessiontoken
                        }
                }).error(function(response)
                    {
                        this.$set('message','Désolé, nous ne avons pas réussi à vous authentifier. Réessayez.');
                        this.$set('error',true);
                    });

            this.$cookie.set('test', 'Hello world!', 1);
            console.log(this.$cookie.get('test'));
        }.bind(this));
    },

    settoken: function(){
      this.$http.get(apiURL4, function(response){
          this.sessiontoken = response;
          console.log(response);

       });
    },

    getip: function(){
      this.$http.get(apiURLip, function(response){
          this.ip = response;
          console.log(response);                 
       });
    }
  }
 })

这是我的HTML模板:

       <template id="login">
         <div class="login-box">
           <!-- /.login-logo -->
           <div class="login-box-body">
             <div class="alert" v-bind:class="{ 'alert-success': success, 'alert-danger': error}"v-show="message">{{ message }}</div>
               <p class="login-box-msg">Ouvrir une session</p>
               <form v-on:submit.prevent="getauthentifications($event)" >
               <div class="form-group has-feedback">
                 <input  v-model="user" value="cri" class="form-control" placeholder="Email">
                 <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
               </div>
               <div class="form-group has-feedback">
                  <input v-model="password" value="Drup8@92:ocell" class="form-control" placeholder="Password">
                  <span class="glyphicon glyphicon-lock form-control-feedback"></span>
               </div>
               <div class="form-group has-feedback">
                  <a href="#">Mot de passe oublié ?</a><br>
               </div>
               <div class="text-center">
                  <button type="submit" class="btn btn-primary btn-block btn-flat">Ouvrir une session</button>
               </div>
               <div class="social-auth-links text-center">
                  <p>- OU -</p>
               </div>
               <div class="text-center">
                   <button href="#!/register" class="btn btn-default btn-block btn-flat">S'inscrire</button>
               </div>
              </form>              

             </div>
             <!-- /.login-box-body -->
           </div>
        </template>

如果有人遇到此类错误或找到解决方案,请告诉我。

0 个答案:

没有答案