21.11.24 - TIL [Vue - style scoped]
style scoped <style scoped>
が使用される場合、CSSは要素の別名にのみ適用されます.
sopedを適用すると<template>
<div class="example">Hello World</div>
</template>
<style scoped>
.example {
color: blue;
}
</style>
このように自動変換します.<template>
<div class="example" data-v-f123ggf>Hello World</div>
</template>
<style scoped>
.example[data-v-f123ggf] {
color: blue;
}
</style>
親コンポーネントでscopedを使用すると、サブコンポーネントまで下に延びます.
コンポーネントとして挿入されるブロック部分は、コンテナの親コンテナのscopedです.
サブアセンブリブロックに下がるのが見えます.
サブコンポーネントもstylescopedを使用しているため、data-vで始まる2つの名前があります.
親スタイルでタグを使用すると、サブコンポーネントに影響を与える可能性があります.class、idを使用してスタイルを割り当てることをお勧めします.
振り返る
今日は今日のポリジョーン開発者の特別講座を聞きました.私が他の人と違う武器があるかどうか真剣に考えなければなりません.今から見れば...全然ありません.
そして今から自分が行きたい分野や会社を探して分析します.あの会社は何を求めているのか、どんな人がほしいのか、今から探求して、これからチャンスがあれば捕まえることができます.
Reference
この問題について(21.11.24 - TIL [Vue - style scoped]), 我々は、より多くの情報をここで見つけました
https://velog.io/@sjkim_jinnyk/21.11.24-TIL
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
<template>
<div class="example">Hello World</div>
</template>
<style scoped>
.example {
color: blue;
}
</style>
<template>
<div class="example" data-v-f123ggf>Hello World</div>
</template>
<style scoped>
.example[data-v-f123ggf] {
color: blue;
}
</style>
今日は今日のポリジョーン開発者の特別講座を聞きました.私が他の人と違う武器があるかどうか真剣に考えなければなりません.今から見れば...全然ありません.
そして今から自分が行きたい分野や会社を探して分析します.あの会社は何を求めているのか、どんな人がほしいのか、今から探求して、これからチャンスがあれば捕まえることができます.
Reference
この問題について(21.11.24 - TIL [Vue - style scoped]), 我々は、より多くの情報をここで見つけました https://velog.io/@sjkim_jinnyk/21.11.24-TILテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol