Nuxt.js: inheritAttrs: false doesn't work properly with universal mode
Version
Reproduction link
https://github.com/Tibon4ik/nuxt-ssr-inherit-attrs
Steps to reproduce
Clone the repo
- $ npm install
- $ npm run dev
What is expected ?
html element with class "app-card" should not have attribute "app-card-prop"
What is actually happening?
html element with class "app-card" has attribute "app-card-prop"
Additional comments?
This bug happens when i use component with inheritAttrs: false, which use another component on top level of section or render function.
I want to pass props to inner component with v-bind="$attrs" and inheritAttrs: false. It passes props inside but still adds attributes to html element.
This issue doesn't occur in "spa" mode but in "universal" mode it exists in "dev" process and stay in "build" + "start" process.
Quick sample:
I have AppCard component
https://monosnap.com/file/GGbNVUgCNQmzGFh46JemMxMubAcxls
And i have PlayerCard component which uses AppCard component and pass props with v-bind="$attrs" and inheritAttrs: false
https://monosnap.com/file/paLwmTwxoiEnL4CFHSXMjaFcmJaN4B
And then i use PlayerCard with prop of AppCard component
https://monosnap.com/file/5Xr7JGoMeS130YqOHZzfLF2RfhFTfE
Resulting html element has "app-card-prop" html attribute (as in "What is actually happening?" section)
I noticed that this bug doesn't occur in next cases:
- if i set inheritAttrs: false on inner component (AppComponent of "Quick sample").
- if top level of or render function is not another component (e.g. simple "div" or "span"). Like this: https://monosnap.com/file/n5CvWOL3KF44gzevVirmCtsjF4CCWw
Tibon4ik
All 2 comments
This sounds like a vue-server-renderer issue at first.
Could you check if it behaves the same "wrong" way when using just vue-server-renderer? (Example of how to create a reproduction: https://github.com/vuejs/vue/issues/10733)
manniL
on 8 Apr 2020
Yes, it is a problem of vue-server-renderer. Same bug there. Further info in https://github.com/vuejs/vue/issues/11297.
P.S. Thank you for example.
Tibon4ik
on 8 Apr 2020
Related issues
bimohxh
路
3Comments
VincentLoy
路
3Comments
pehbehbeh
路
3Comments
bimohxh
路
3Comments
nassimbenkirane
路
3Comments
Most helpful comment
Yes, it is a problem of vue-server-renderer. Same bug there. Further info in https://github.com/vuejs/vue/issues/11297.
P.S. Thank you for example.