Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Scoped style not working in extend component #6158

Open
leey0818 opened this issue Jun 22, 2022 · 2 comments
Open

Scoped style not working in extend component #6158

leey0818 opened this issue Jun 22, 2022 · 2 comments
Labels
need guidance The approach/solution in the PR is unclear and requires guidance from maintainer to proceed further.

Comments

@leey0818
Copy link

Vue version

3.2.37

Link to minimal reproduction

https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHNjcmlwdCBzZXR1cD5cbmltcG9ydCBDb21wIGZyb20gJy4vQ29tcC52dWUnO1xuaW1wb3J0IEV4dGVuZGVkQ29tcCBmcm9tICcuL0V4dGVuZGVkQ29tcC52dWUnO1xuPC9zY3JpcHQ+XG5cbjx0ZW1wbGF0ZT5cbiAgPENvbXA+PC9Db21wPlxuICA8aHIvPlxuICA8RXh0ZW5kZWRDb21wPjwvRXh0ZW5kZWRDb21wPlxuPC90ZW1wbGF0ZT4iLCJpbXBvcnQtbWFwLmpzb24iOiJ7XG4gIFwiaW1wb3J0c1wiOiB7XG4gICAgXCJ2dWVcIjogXCJodHRwczovL3VucGtnLmNvbS9AdnVlL3J1bnRpbWUtZG9tQDMuMi4zNy9kaXN0L3J1bnRpbWUtZG9tLmVzbS1icm93c2VyLmpzXCIsXG4gICAgXCJ2dWUvc2VydmVyLXJlbmRlcmVyXCI6IFwiaHR0cHM6Ly91bnBrZy5jb20vQHZ1ZS9zZXJ2ZXItcmVuZGVyZXJAMy4yLjM3L2Rpc3Qvc2VydmVyLXJlbmRlcmVyLmVzbS1icm93c2VyLmpzXCJcbiAgfVxufSIsIkNvbXAudnVlIjoiPHNjcmlwdCBsYW5nPVwidHNcIj5cbmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7XG5cbmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7XG4gIGRhdGE6ICgpID0+ICh7XG4gICAgdGV4dDogJ0hlbGxvJ1xuICB9KVxufSk7XG48L3NjcmlwdD5cblxuPHRlbXBsYXRlPlxuICA8cCBjbGFzcz1cInRleHRcIj5cbiAgICB7eyB0ZXh0IH19XG4gIDwvcD5cbjwvdGVtcGxhdGU+XG5cbjxzdHlsZSBzY29wZWQ+XG4udGV4dCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHllbGxvdztcbiAgcGFkZGluZzogMTBweDtcbiAgZm9udC1zaXplOiAxLjNyZW07XG59XG48L3N0eWxlPiIsIkV4dGVuZGVkQ29tcC52dWUiOiI8c2NyaXB0IGxhbmc9XCJ0c1wiPlxuaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJztcbmltcG9ydCBDb21wIGZyb20gJy4vQ29tcC52dWUnO1xuXG5leHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoe1xuICBleHRlbmRzOiBDb21wLFxuICBkYXRhOiAoKSA9PiAoe1xuICAgIHRleHQ6ICdIZWxsbyBleHRlbmRlZCdcbiAgfSlcbn0pO1xuPC9zY3JpcHQ+In0=

Steps to reproduce

Show displayed two texts

What is expected?

Extended component must also be styled.

What is actually happening?

Scoped style does not working in extended component.

System Info

No response

Any additional comments?

It works with vue@2.6.11
https://codesandbox.io/s/objective-flower-3o5h2o?file=/src/App.vue
@wellrus wellrus mentioned this issue Jun 22, 2022
Closed
@UcheAzubuko
Copy link

Because the style was scoped, what happened is that the extends options allowed the reuse of template markup only.

@danielmiksavmlyr
Copy link

It is June 2023, Vue version 3.3.4 and the issue is still not resolved nor commented. @yyx990803 I know, that this feature was not officially documented, but it was working in Vue 2.x version. Could you please share your thought on that?

@posva posva added the need guidance The approach/solution in the PR is unclear and requires guidance from maintainer to proceed further. label Jun 27, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
need guidance The approach/solution in the PR is unclear and requires guidance from maintainer to proceed further.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@posva @UcheAzubuko @leey0818 @danielmiksavmlyr