2.6.10
https://codesandbox.io/s/vue-template-7hwty
$attrs
рдкрд░рд┐рд╡рд░реНрддрди рдХрд╛ рдХрд╛рд░рдг рдмрди рд░рд╣рд╛ рд╣реИ рдпрджрд┐ рдЪрд╛рдЗрд▓реНрдб рдХрдВрдкреЛрдиреЗрдВрдЯ рдореЗрдВ attr рдХреЗ рдмрд░рд╛рдмрд░ рдХреБрдВрдЬреА рд╡рд╛рд▓рд╛ рдХреЛрдИ рдкреНрд░реЛрдк рд╣реИредрд░реЗрдВрдбрд░ рдлрд╝рдВрдХреНрд╢рди рдХреЛ рдПрдХ рдмрд╛рд░ рдХреЙрд▓ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ рдФрд░ рдШрдЯрдХ рдХреЗ $attrs
рдХреЛ рдирд╣реАрдВ рдмрджрд▓рд╛ рдЬрд╛рддрд╛ рд╣реИред
рд░реЗрдВрдбрд░ рдХреЛ рджреЛ рдмрд╛рд░ рдХреЙрд▓ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ рдФрд░ attrs
рдЬрд┐рд╕рдХреА рдХреБрдВрдЬреА рд╕рдорд╛рди рд╣реЛрддреА рд╣реИ props
рдЪрд╛рдЗрд▓реНрдб рдХрдВрдкреЛрдиреЗрдВрдЯ рдХреЛ рд╣рдЯрд╛ рджрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред
рдореИрдВрдиреЗ рдЕрдкрдиреЗ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдХрд╕реНрдЯрдо рд▓реЛрдбрд░ рдШрдЯрдХ рдкрд░ рдмрдирд╛рдпрд╛ рд╣реИ рдЬрд┐рд╕реЗ рдЖрд▓рд╕реА рд▓реЛрдб рдХрд┐рдП рдЧрдП рдШрдЯрдХреЛрдВ рдФрд░ рдиреЗрдЯрд╡рд░реНрдХрд┐рдВрдЧ рддреНрд░реБрдЯрд┐рдпреЛрдВ рдХреА рд▓реЛрдбрд┐рдВрдЧ рдХреЛ рд╕рдВрднрд╛рд▓рдирд╛ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ https://vuejs.org/v2/guide/components-dynamic-async.html#Handling -Loading рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ -рдореЗрд░реЗ рдорд╛рдорд▓реЗ рдореЗрдВ рд░рд╛рдЬреНрдпред рдбрд╛рдЙрдирд▓реЛрдб рдХрд┐рдП рдЧрдП рдШрдЯрдХ рдХреЛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛рд╢реАрд▓рддрд╛ (рдЪрд░ рдХреЗ рд░реВрдк рдореЗрдВ рдбреЗрдЯрд╛ рдХреЗ рдмрд╛рд╣рд░) рдореЗрдВ рди рдЬреЛрдбрд╝рдХрд░ рдЗрд╕ рдмрдЧ рдХреЛ рдЫреЛрдбрд╝рд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред
$attrs
: {...this.$attrs}
рдПрдХ рдкреНрд░рддрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рднреА рд╕рдорд╕реНрдпрд╛ рджреВрд░ рд╣реЛ рдЬрд╛рддреА рд╣реИ
рд╢рд╛рдпрдж рдЖрдкрдХреЛ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкреНрд░реЙрдкреНрд╕ рдХрд╛ рдЗрд╕реНрддреЗрдорд╛рд▓ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПя╝Ъ
render(h) {
console.log("Attributes of loader:", this.$attrs);
if (this.targetComponent) {
return h(this.targetComponent, {
props: this.$attrs // Change attrs to propsя╝Мnot `attrs: this.$attrs`
});
} else {
return h("div", "Component is loading");
}
}
рдХреНрдпреЛрдВрдХрд┐ рдЖрдк рд╕рд╣рд╛рд░рд╛ рд▓реЗрдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣реЗ рд╣реИрдВ
const targetComponent = {
props: {
// COMMENT PROP
someProp: {
type: String
}
},
render(h) {
console.log("Props of target", this.$props); // You can not get $props when render params only has attrs
return h("div", "WITH PROP:" + this.someProp);
}
};
рджреЛрдиреЛрдВ рдПрдЯреНрд░реНрд╕ рдХреА рдХреЙрдкреА рдмрдирд╛рдиреЗ рдФрд░ рдкреНрд░реЙрдкреНрд╕ рдХреЗ рд╕рд╛рде рдЧреБрдЬрд░рдиреЗ рд╕реЗ рдореЗрд░реА рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдорд╛рдзрд╛рди рд╣реЛ рдЬрд╛рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдореИрдВ рдЕрднреА рднреА рдЙрддреНрд╕реБрдХ рд╣реВрдВ рдХрд┐ рдореВрд▓ рдШрдЯрдХ $attrs
рдмрдЪреНрдЪреЗ рдХреЛ рд░реЗрдВрдбрд░ рдХрд░рдиреЗ рдХреЗ рдХрд╛рд░рдг рдХреНрдпреЛрдВ рдмрджрд▓ рд░рд╣реЗ рд╣реИрдВ рдЬрд┐рд╕рдореЗрдВ рдПрдХ рд╣реА рдХреБрдВрдЬреА рдХреЗ рд╕рд╛рде рдкреНрд░реЙрдкреНрд╕ рд╣реЛрддреЗ рд╣реИрдВ?
рдРрд╕рд╛ рдЗрд╕рд▓рд┐рдП рд╣реИ рдХреНрдпреЛрдВрдХрд┐ $attrs
рдСрдмреНрдЬреЗрдХреНрдЯ рдХреЛ рдлрд┐рд░ рд╕реЗ рдЕрд╕рд╛рдЗрди рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИред рдореБрдЭреЗ рдкрддрд╛ рдерд╛ рдХрд┐ рдореИрдВрдиреЗ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдкрд╣рд▓реЗ рд╣реА рдХрд╣реАрдВ рдФрд░ рджреЗрдЦрд╛ рд╣реИ:
https://github.com/vuejs/vue/issues/10115 рдХрд╛ рдбреБрдкреНрд▓рд┐рдХреЗрдЯ