Vue精简版风格代码分享
Vue官网的风格指南按照优先级（依次为必要、强烈推荐、推荐、谨慎使用）分类，且代码间隔较大，不易查询。本文按照类型分类，并对部分示例或解释进行缩减，是Vue风格指南的精简版，本文主要介绍了Vue精简版风格指南的相关资料，包括组件名称，指令及特征,需要的朋友可以参考下，希望能帮助到大家。
组件名称
【组件名为多个单词】（必要）
组件名应该始终是多个单词的，根组件 App 除外。 这样做可以避免跟现有的以及未来的 HTML 元素相冲突，因为所有的 HTML 元素名称都是单个单词的
//bad
Vue.component('todo', {})
//good
Vue.component('todo-item', {})【单文件组件文件名应该要么始终是单词大写开头 (PascalCase)，要么始终横线连接 (kebab-case)】（强烈推荐）
//bad mycomponent.vue //good MyComponent.vue //good my-component.vue
【基础组件名要有一个特定前缀开头】（强烈推荐）
应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头，比如 Base、App 或 V
//bad components/ |- MyButton.vue |- VueTable.vue |- Icon.vue //good components/ |- BaseButton.vue |- BaseTable.vue |- BaseIcon.vue
【只应该拥有单个活跃实例的组件应该以 The 前缀命名，以示其唯一性】（强烈推荐）
这不意味着组件只可用于一个单页面，而是 每个页面 只使用一次，这些组件永远不接受任何 prop
//bad components/ |- Heading.vue |- MySidebar.vue //good components/ |- TheHeading.vue |- TheSidebar.vue
【和父组件紧密耦合的子组件应该以父组件名作为前缀命名】（强烈推荐）
//bad components/ |- TodoList.vue |- TodoItem.vue |- TodoButton.vue //good components/ |- SearchSidebar.vue |- SearchSidebarNavigation.vue
【组件名应该以高级别的 (通常是一般化描述的) 单词开头，以描述性的修饰词结尾】（强烈推荐）
//bad components/ |- ClearSearchButton.vue |- ExcludeFromSearchInput.vue |- LaunchOnStartupCheckbox.vue |- RunSearchButton.vue |- SearchInput.vue |- TermsCheckbox.vue //good components/ |- SearchButtonClear.vue |- SearchButtonRun.vue |- SearchInputQuery.vue |- SearchInputExcludeGlob.vue |- SettingsCheckboxTerms.vue |- SettingsCheckboxLaunchOnStartup.vue
【单文件组件和字符串模板中组件名应总是PascalCase——但在DOM模板中总是kebab-case】（强烈推荐）
//bad <!-- 在单文件组件和字符串模板中 --> <mycomponent/> <myComponent/> <!-- 在 DOM 模板中 --> <MyComponent></MyComponent> //good <!-- 在单文件组件和字符串模板中 --> <MyComponent/> <!-- 在 DOM 模板中 --> <my-component></my-component>
【组件名应该倾向于完整单词而不是缩写】（强烈推荐）
//bad components/ |- SdSettings.vue |- UProfOpts.vue //good components/ |- StudentDashboardSettings.vue |- UserProfileOptions.vue
组件相关
【单文件组件、字符串模板和JSX中没有内容的组件应该自闭合——但在DOM模板里不要这样做】（强烈推荐）
自闭合组件表示它们不仅没有内容，而且刻意没有内容
//bad <!-- 在单文件组件、字符串模板和 JSX 中 --> <MyComponent></MyComponent> <!-- 在 DOM 模板中 --> <my-component/> //good <!-- 在单文件组件、字符串模板和 JSX 中 --> <MyComponent/> <!-- 在 DOM 模板中 --> <my-component></my-component>
【为组件样式设置作用域】（必要）
这条规则只和单文件组件有关。 不一定 要使用 scoped 特性。设置作用域也可以通过 CSS Modules，或者使用其它的库或约定
//bad
<template><button class="btn btn-close">X</button></template>
<style>
.btn-close {background-color: red;}
</style>
//good
<template><button class="btn btn-close">X</button></template>
<style scoped>
.btn-close {background-color: red;}
</style>
//good
<template><button :class="[$style.button, $style.buttonClose]">X</button></template>
<style module>
.btn-close {background-color: red;}
</style>【单文件组件应该总是让
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
1393
52
1205
24
Bagaimana untuk berkongsi Quark Netdisk ke Baidu Netdisk?
Mar 14, 2024 pm 04:40 PM
Quark Netdisk dan Baidu Netdisk adalah kedua-dua alat storan yang sangat mudah Ramai pengguna bertanya sama ada kedua-dua perisian ini boleh dikendalikan? Bagaimana untuk berkongsi Quark Netdisk ke Baidu Netdisk? Biarkan laman web ini memperkenalkan kepada pengguna secara terperinci cara menyimpan fail Quark Network Disk ke Baidu Network Disk. Cara menyimpan fail dari Cakera Rangkaian Quark ke Cakera Rangkaian Baidu Kaedah 1. Jika anda ingin tahu cara memindahkan fail dari Cakera Rangkaian Quark ke Cakera Rangkaian Baidu, mula-mula muat turun fail yang perlu disimpan pada Cakera Rangkaian Quark, dan kemudian buka klien Cakera Rangkaian Baidu , pilih folder tempat fail yang dimampatkan akan disimpan dan klik dua kali untuk membuka folder. 2. Selepas membuka folder, klik "Muat naik" di penjuru kiri sebelah atas tetingkap. 3. Cari fail termampat yang perlu dimuat naik pada komputer anda dan klik untuk memilihnya.
Cara berkongsi Muzik Awan NetEase ke WeChat Moments_Tutorial untuk berkongsi Muzik Awan NetEase ke Momen WeChat
Mar 25, 2024 am 11:41 AM
1. Mula-mula, kami masukkan Muzik Awan NetEase, dan kemudian klik pada antara muka laman utama perisian untuk memasuki antara muka main balik lagu. 2. Kemudian dalam antara muka main balik lagu, cari butang fungsi perkongsian di bahagian atas sebelah kanan, seperti yang ditunjukkan dalam kotak merah dalam rajah di bawah, klik untuk memilih saluran perkongsian dalam saluran perkongsian, klik pilihan "Kongsi ke". bahagian bawah, dan kemudian pilih "WeChat Moments" yang pertama membolehkan anda berkongsi kandungan ke WeChat Moments.
Cara berkongsi fail dengan rakan di Baidu Netdisk
Mar 25, 2024 pm 06:52 PM
Baru-baru ini, klien Android Baidu Netdisk telah memperkenalkan versi baharu 8.0.0 Versi ini bukan sahaja membawa banyak perubahan, tetapi juga menambah banyak fungsi praktikal. Antaranya, yang paling menarik perhatian ialah peningkatan fungsi perkongsian folder. Kini, pengguna boleh dengan mudah menjemput rakan untuk menyertai dan berkongsi fail penting dalam kerja dan kehidupan, mencapai kerjasama dan perkongsian yang lebih mudah. Jadi bagaimana anda berkongsi fail yang anda perlukan untuk berkongsi dengan rakan-rakan anda Di bawah, editor laman web ini akan memberikan pengenalan terperinci kepada anda. 1) Buka Baidu Cloud APP, mula-mula klik untuk memilih folder yang berkaitan pada halaman utama, dan kemudian klik ikon [...] di penjuru kanan sebelah atas antara muka (seperti yang ditunjukkan di bawah) 2) Kemudian klik [+] masuk; lajur "Ahli Dikongsi" 】, dan akhirnya semak semua
Apakah kunci pengaktifan untuk edisi perusahaan win7?
Jul 09, 2023 pm 03:01 PM
Adakah anda mempunyai kunci pengaktifan terkini untuk edisi perusahaan win7? Jika anda memasang versi perusahaan win7 rasmi, anda akan digesa untuk mengaktifkannya dengan kunci produk windows7 enterprise, jika tidak, ia tidak akan berfungsi dengan betul. Jadi editor akan berkongsi dengan anda beberapa kata laluan pengaktifan versi perusahaan win7, mari kita lihat. Q3VMJ-TMJ3M-99RF9-CVPJ3-Q7VF3KGMPT-GQ6XF-DM3VM-HW6PR-DX9G8MT39G-9HYXX-J3V3Q-RPXJB-RQ6D79JBBV-7Q7P7-CTDB7-KYBKG-X8HHQDDH2BKG-X8HHCPY6BKG Q
Perkongsian akaun ahli tv mangga 2023
Feb 07, 2024 pm 02:27 PM
Mango TV mempunyai pelbagai jenis filem, siri TV, rancangan pelbagai dan sumber lain, dan pengguna bebas memilih untuk menontonnya. Ahli Mango TV bukan sahaja boleh menonton semua drama VIP, tetapi juga menetapkan kualiti gambar definisi tertinggi untuk membantu pengguna menonton drama dengan gembira Di bawah, editor akan membawakan anda beberapa akaun keahlian Mango TV percuma untuk digunakan oleh pengguna, cepat dan lihat. Cuba tengok. Perkongsian percuma akaun ahli terbaru Mango TV 2023: Nota: Ini adalah akaun ahli terkini yang dikumpul, anda boleh log masuk dan menggunakannya secara terus, jangan tukar kata laluan sesuka hati. Nombor akaun: 13842025699 Kata laluan: qds373 Nombor akaun: 15804882888 Kata laluan: evr6982 Nombor akaun: 13330925667 Kata laluan: jgqae Nombor akaun: 1703
Selesaikan masalah bahawa perkongsian Discuz WeChat tidak dapat dipaparkan
Mar 09, 2024 pm 03:39 PM
Tajuk: Untuk menyelesaikan masalah yang dikongsi oleh Discuz WeChat tidak dapat dipaparkan, contoh kod khusus diperlukan Dengan pembangunan Internet mudah alih, WeChat telah menjadi bahagian yang sangat diperlukan dalam kehidupan seharian orang ramai. Dalam pembangunan tapak web, untuk meningkatkan pengalaman pengguna dan mengembangkan pendedahan laman web, banyak tapak web akan menyepadukan fungsi perkongsian WeChat, membolehkan pengguna berkongsi kandungan tapak web dengan mudah ke kumpulan Moments atau WeChat. Walau bagaimanapun, kadangkala apabila menggunakan sistem forum sumber terbuka seperti Discuz, anda akan menghadapi masalah yang dikongsi WeChat tidak dapat dipaparkan, yang membawa kesukaran tertentu kepada pengalaman pengguna.
Bagaimana untuk berkongsi hotspot wifi dalam sistem win7
Jul 01, 2023 pm 01:53 PM
Bagaimana untuk berkongsi hotspot wifi dalam sistem win7? Selepas komputer kita disambungkan ke rangkaian, ia juga boleh berkongsi rangkaian wayarles. Ramai pengguna ingin berkongsi rangkaian komputer mereka ke telefon mudah alih mereka untuk digunakan. Ramai rakan tidak tahu bagaimana untuk beroperasi secara terperinci Editor di bawah telah menyusun langkah-langkah bagaimana untuk berkongsi hotspot wifi dalam sistem win7 Jika anda berminat, ikuti editor dan teruskan membaca. Langkah-langkah untuk berkongsi hotspot wifi dalam sistem win7 1. Jika anda ingin menghidupkan wifi hotspot, anda mesti mempunyai kad rangkaian tanpa wayar terlebih dahulu Jika anda mempunyai PC, anda boleh membeli wifi mudah alih untuk dikongsi wifi, yang tidak akan diterangkan di sini. Mula-mula tekan kekunci windows pada papan kekunci untuk membuka menu mula
Kongsi dua kaedah pemasangan untuk pemacu pencetak HP
Mar 13, 2024 pm 05:16 PM
Pencetak HP ialah peralatan pencetakan yang penting di kebanyakan pejabat Memasang pemacu pencetak pada komputer boleh menyelesaikan masalah dengan sempurna seperti pencetak tidak dapat disambungkan. Jadi bagaimana untuk memasang pemacu pencetak HP? Editor di bawah akan memperkenalkan anda kepada dua kaedah pemasangan pemacu pencetak HP. Kaedah pertama: muat turun pemacu dari tapak web rasmi 1. Cari laman web rasmi HP China dalam enjin carian, dan dalam lajur sokongan, pilih [Perisian dan Pemacu]. 2. Pilih kategori [Pencetak], masukkan model pencetak anda dalam kotak carian, dan klik [Serah] untuk mencari pemacu pencetak anda. 3. Pilih pencetak yang sepadan mengikut sistem komputer anda Untuk win10, pilih pemacu untuk sistem win10. 4. Selepas memuat turun berjaya, cari dalam folder
