when I use functional rendering, I find that the element I render does not have data-v-xxx, but everything else, and then my style cannot affect the element I rendered manually. The
vue component generates an additional data-v-xxx, when generating the element, or how do I get it, or when I render the function, I also render a data-v-xxx
those with data-v-xxx should be added with the scoped attribute, which is automatically generated by vue.
<style scoped>
@media (min-width: 250px) {
.list-container:hover {
background: orange;
}
}
</style>this optional scoped property automatically adds a unique attribute (such as data-v-21e5b78) to specify the scope for the CSS in the component, and at compile time. List-container:hover will be compiled to look like. List-container [data-v-21e5b78]: hover.
this is only available when scoped is added to the component. You can manually add one to the tag.
<div data-v-231></div>what do you want to do with this element?
the landlord can use depth selection. / deep/ or > to select the element
ide/scoped-css.html" rel=" nofollow noreferrer "> https://vue-loader.vuejs.org/.
does the landlord have a solution? ask
Don't use scoped
Previous: The crawling order of paging crawlers
Next: How to abandon the previous request using axios, in vue