Partage de code de style simplifié Vue
Le guide de style sur le site officiel de Vue est classé par priorité (nécessaire, fortement recommandé, recommandé et utilisé avec prudence), et les intervalles de code sont grands et difficiles à interroger. Cet article est classé par type et réduit quelques exemples ou explications.Il s'agit d'une version simplifiée du guide de style Vue.Cet article présente principalement les informations pertinentes du guide de style simplifié Vue, y compris les noms des composants, les instructions et les fonctionnalités. je peux m'y référer. J'espère que cela aidera tout le monde.
Nom du composant
[Le nom du composant doit être composé de plusieurs mots] (obligatoire)
Le nom du composant doit toujours être composé de plusieurs mots, à l'exception du composant racine App. Cela évite les conflits avec les éléments HTML existants et futurs, puisque tous les noms d'éléments HTML sont constitués d'un seul mot
//bad
Vue.component('todo', {})
//good
Vue.component('todo-item', {})[Les noms de fichiers de composants de fichiers uniques doivent toujours commencer par une lettre majuscule ( PascalCase) ou toujours connectés avec une ligne horizontale (kebab-case)] (fortement recommandé)
//bad mycomponent.vue //good MyComponent.vue //good my-component.vue
[Le nom du composant de base doit commencer par un préfixe spécifique] (fortement recommandé)
Composants de base spécifiques à l'application de les styles et les conventions (c'est-à-dire les composants de présentation, non logiques ou sans état) doivent tous commencer par un préfixe spécifique, tel que Base, App ou V
//bad components/ |- MyButton.vue |- VueTable.vue |- Icon.vue //good components/ |- BaseButton.vue |- BaseTable.vue |- BaseIcon.vue
[ne devraient avoir que les composants d'une seule instance active doivent être nommés avec le préfixe The pour montrer leur unicité] (fortement recommandé)
Cela ne signifie pas que le composant ne peut être utilisé que sur une seule page, mais que chaque page ne peut être utilisée qu'une seule fois. N'acceptez jamais aucun accessoire
//bad components/ |- Heading.vue |- MySidebar.vue //good components/ |- TheHeading.vue |- TheSidebar.vue
[Les sous-composants étroitement couplés au composant parent doivent être nommés avec le nom du composant parent comme préfixe] (fortement recommandé)
//bad components/ |- TodoList.vue |- TodoItem.vue |- TodoButton.vue //good components/ |- SearchSidebar.vue |- SearchSidebarNavigation.vue
[Le le nom du composant doit être préfixé par des mots de haut niveau (généralement décrits en général) commençant et se terminant par des modificateurs descriptifs] (fortement recommandé)
//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
[Les noms de composants dans les composants à fichier unique et les modèles de chaîne doivent toujours être PascalCase ——Mais toujours kebab-case dans le modèle DOM] (fortement recommandé)
//bad <!-- 在单文件组件和字符串模板中 --> <mycomponent/> <myComponent/> <!-- 在 DOM 模板中 --> <MyComponent></MyComponent> //good <!-- 在单文件组件和字符串模板中 --> <MyComponent/> <!-- 在 DOM 模板中 --> <my-component></my-component>
[Les noms des composants doivent avoir tendance à être des mots complets plutôt que des abréviations] (fortement recommandé)
//bad components/ |- SdSettings.vue |- UProfOpts.vue //good components/ |- StudentDashboardSettings.vue |- UserProfileOptions.vue
Lié aux composants
[Les composants de fichier unique, les modèles de chaînes et les composants sans contenu dans JSX doivent se fermer automatiquement - mais ne le faites pas dans les modèles DOM] (fortement recommandé)
Auto -les composants de fermeture indiquent non seulement qu'ils n'ont pas de contenu, mais qu'ils n'ont intentionnellement aucun contenu
//bad <!-- 在单文件组件、字符串模板和 JSX 中 --> <MyComponent></MyComponent> <!-- 在 DOM 模板中 --> <my-component/> //good <!-- 在单文件组件、字符串模板和 JSX 中 --> <MyComponent/> <!-- 在 DOM 模板中 --> <my-component></my-component>
[Définir la portée des styles de composants] (obligatoire)
Cette règle ne concerne que les fichiers uniques composants. Il n'est pas nécessaire d'utiliser l'attribut scoped. La portée peut également être effectuée via des modules CSS ou en utilisant d'autres bibliothèques ou conventions
//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>[Les composants à fichier unique doivent toujours avoir l'ordre des balises
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Sujets chauds
1393
52
1205
24
Comment partager Quark Netdisk avec Baidu Netdisk ?
Mar 14, 2024 pm 04:40 PM
Quark Netdisk et Baidu Netdisk sont tous deux des outils de stockage très pratiques. De nombreux utilisateurs se demandent si ces deux logiciels sont interopérables ? Comment partager Quark Netdisk avec Baidu Netdisk ? Laissez ce site présenter en détail aux utilisateurs comment enregistrer les fichiers Quark Network Disk sur Baidu Network Disk. Comment enregistrer des fichiers de Quark Network Disk vers Baidu Network Disk Méthode 1. Si vous souhaitez savoir comment transférer des fichiers de Quark Network Disk vers Baidu Network Disk, téléchargez d'abord les fichiers qui doivent être enregistrés sur Quark Network Disk, puis ouvrez le client Baidu Network Disk, sélectionnez le dossier dans lequel le fichier compressé doit être enregistré et double-cliquez pour ouvrir le dossier. 2. Après avoir ouvert le dossier, cliquez sur « Télécharger » dans le coin supérieur gauche de la fenêtre. 3. Recherchez le fichier compressé qui doit être téléchargé sur votre ordinateur et cliquez pour le sélectionner.
Comment partager NetEase Cloud Music avec WeChat Moments_Tutorial sur le partage de NetEase Cloud Music avec WeChat Moments
Mar 25, 2024 am 11:41 AM
1. Tout d'abord, nous entrons dans NetEase Cloud Music, puis cliquons sur l'interface de la page d'accueil du logiciel pour accéder à l'interface de lecture de chansons. 2. Ensuite, dans l'interface de lecture de la chanson, recherchez le bouton de fonction de partage en haut à droite, comme indiqué dans l'encadré rouge de la figure ci-dessous, cliquez pour sélectionner le canal de partage dans le canal de partage, cliquez sur l'option « Partager sur » sur en bas, puis sélectionnez le premier « WeChat Moments » qui vous permet de partager du contenu avec WeChat Moments.
Comment partager des fichiers avec des amis sur Baidu Netdisk
Mar 25, 2024 pm 06:52 PM
Récemment, le client Android Baidu Netdisk a inauguré une nouvelle version 8.0.0. Cette version apporte non seulement de nombreux changements, mais ajoute également de nombreuses fonctions pratiques. Parmi eux, le plus frappant est l’amélioration de la fonction de partage de dossiers. Désormais, les utilisateurs peuvent facilement inviter des amis à rejoindre et partager des fichiers importants au travail et dans la vie, obtenant ainsi une collaboration et un partage plus pratiques. Alors, comment partager les fichiers que vous devez partager avec vos amis ? Ci-dessous, l'éditeur de ce site vous fera une introduction détaillée, j'espère qu'il pourra vous aider ! 1) Ouvrez l'application Baidu Cloud, cliquez d'abord pour sélectionner le dossier approprié sur la page d'accueil, puis cliquez sur l'icône [...] dans le coin supérieur droit de l'interface (comme indiqué ci-dessous) 2) Cliquez ensuite sur [+] dans la colonne "Membres partagés" 】, et enfin cochez tous
Quelles sont les clés d'activation de Win7 Enterprise Edition ?
Jul 09, 2023 pm 03:01 PM
Avez-vous la dernière clé d'activation pour Win7 Enterprise Edition ? Si vous installez la version officielle de Win7 Enterprise, vous serez invité à l'activer avec la clé de produit Windows7 Enterprise, sinon elle ne fonctionnera pas correctement. L'éditeur partagera donc avec vous quelques mots de passe d'activation de la version win7 entreprise, jetons un coup d'œil. 6 JQ
Partage de compte membre Mango tv 2023
Feb 07, 2024 pm 02:27 PM
Mango TV propose différents types de films, séries télévisées, émissions de variétés et autres ressources, et les utilisateurs peuvent choisir librement de les regarder. Les membres de Mango TV peuvent non seulement regarder toutes les séries VIP, mais également définir la qualité d'image la plus haute définition pour aider les utilisateurs à regarder les séries avec plaisir. Ci-dessous, l'éditeur vous proposera des comptes d'adhésion gratuits à Mango TV que les utilisateurs pourront utiliser, dépêchez-vous et jetez un œil. Regarde. Mango TV dernier compte membre partage gratuit 2023 : Remarque : Ce sont les derniers comptes membres collectés, vous pouvez vous connecter et les utiliser directement, ne changez pas le mot de passe à volonté. Numéro de compte : 13842025699 Mot de passe : qds373 Numéro de compte : 15804882888 Mot de passe : evr6982 Numéro de compte : 13330925667 Mot de passe : jgqae Numéro de compte : 1703
Résolvez le problème selon lequel le partage Discuz WeChat ne peut pas être affiché
Mar 09, 2024 pm 03:39 PM
Titre : Pour résoudre le problème de l'impossibilité d'afficher les partages Discuz WeChat, des exemples de code spécifiques sont nécessaires. Avec le développement de l'Internet mobile, WeChat est devenu un élément indispensable de la vie quotidienne des gens. Dans le développement de sites Web, afin d'améliorer l'expérience utilisateur et d'étendre la visibilité du site Web, de nombreux sites Web intégreront des fonctions de partage WeChat, permettant aux utilisateurs de partager facilement le contenu du site Web avec des groupes Moments ou WeChat. Cependant, parfois, lorsque vous utilisez des systèmes de forum open source tels que Discuz, vous rencontrerez le problème de l'impossibilité d'afficher les partages WeChat, ce qui entraîne certaines difficultés pour l'expérience utilisateur.
Comment partager un point d'accès Wi-Fi dans le système Win7
Jul 01, 2023 pm 01:53 PM
Comment partager un hotspot wifi dans le système win7 ? Une fois notre ordinateur connecté au réseau, il peut également partager des réseaux sans fil. De nombreux utilisateurs souhaitent partager le réseau de leur ordinateur avec leurs téléphones mobiles pour pouvoir les utiliser. De nombreux amis ne savent pas comment fonctionner en détail. L'éditeur ci-dessous a compilé les étapes à suivre pour partager des points d'accès Wi-Fi dans le système Win7. Si vous êtes intéressé, suivez l'éditeur et continuez à lire ! Étapes pour partager un point d'accès Wi-Fi dans le système Win7 1. Pour activer le point d'accès Wi-Fi, vous devez d'abord disposer d'une carte réseau sans fil. L'ordinateur portable est fourni avec celui-ci. Si vous avez un PC, vous pouvez acheter un réseau Wi-Fi portable pour partager le Wi-Fi. ne sera pas décrit ici. Appuyez d'abord sur la touche Windows du clavier pour ouvrir le menu Démarrer
Partagez deux méthodes d'installation pour les pilotes d'imprimante HP
Mar 13, 2024 pm 05:16 PM
Les imprimantes HP sont des équipements d'impression essentiels dans de nombreux bureaux. L'installation du pilote d'imprimante sur l'ordinateur peut parfaitement résoudre des problèmes tels que l'impossibilité de se connecter de l'imprimante. Alors, comment installer le pilote d'imprimante HP ? L'éditeur ci-dessous vous présentera deux méthodes d'installation du pilote d'imprimante HP. La première méthode : télécharger le pilote depuis le site officiel 1. Recherchez le site officiel de HP Chine dans le moteur de recherche et dans la colonne d'assistance, sélectionnez [Logiciel et pilotes]. 2. Sélectionnez la catégorie [Imprimante], entrez votre modèle d'imprimante dans la zone de recherche et cliquez sur [Soumettre] pour trouver votre pilote d'imprimante. 3. Sélectionnez l'imprimante correspondante en fonction de votre système informatique. Pour win10, sélectionnez le pilote pour le système win10. 4. Une fois le téléchargement réussi, recherchez-le dans le dossier
