components - How to Two-way Data Binding Between Parents and grandchildren in Vue.js -


i faced problem, solve cookies want solve problem without cookies. have component called app-header , has component called outmodal. now, first vue instance require component app-header.

var vue = new vue({     el : "html",     data : {         title       : "site title",         description : "description of page",         keywords    : "my keywords",         view        : "home",         login       : "login"     },     components:{         "app-header" :require("../../components/header"),         "app-footer" :require("../../components/footer"),         "home"       :require("../../views/home")     }, }); 

code of app-header

var vue     = require("vue");  vue.partial("login",require("../../partials/login.html")); vue.partial("logged",require("../../partials/logged.html"));  module.exports = {     template    : require("./template.html"),     replace     : true,     components  : {         outmodal : require("../outmodal")     },     props : ['login'] } 

code of outmodal

var vue = require("vue"); vue.partial("loginmodal",require("../../partials/loginmodal.html"));  module.exports = {     template    : require("./template.html"),     replace     : true,     props       : ['name'],     data        : function () {             return  {                 userlogin : { mail  :   "", password    :   "", remember    :   ""}             }      },     methods : {         formsubmit : function(e){                 e.preventdefault();                 this.$http.post("http://example.com/auth/login",{ "email": this.userlogin.mail , "password": this.userlogin.password },function(data,status,request){                     $.cookie("site_token",data.token,{expires : 1})                 }).error(function(data,status,request){                  });          }     }, ready  : function(){         console.log("it works")     } } 

in outmodal component connect api , check login, if login succesfull, want change value of login variable in vue instance. use web pack build requires. don't know how can data binding between these files.

how can solve it? i

the best solution found

for 0.12

http://012.vuejs.org/guide/components.html#inheriting_parent_scope

for 1.0

http://v1.vuejs.org/guide/components.html#parent-child-communication

for 2.0

https://vuejs.org/v2/guide/components.html#composing-components (use props one-way bind data parent child)


Comments

Popular posts from this blog

c - Bitwise operation with (signed) enum value -

xslt - Unnest parent nodes by child node -

YouTubePlayerFragment cannot be cast to android.support.v4.app.Fragment -