Que faire si le chemin de la ressource image vue.js est incorrect
La solution au chemin incorrect de la ressource image vue.js : 1. Utilisez v-bind pour lier l'attribut src de l'image ; 2. Utilisez import pour introduire le chemin de l'image ; le dossier statique externe à l'intérieur, puis définissez imgUrl dans data.
L'environnement d'exploitation de ce tutoriel : système Windows 7, vue version 2.0, ordinateur DELL G3 Cette méthode convient à toutes les marques d'ordinateurs.
[Recommandations d'articles connexes : vue.js]
Lorsque nous référençons des images dans le projet Vue.js, il existe les situations suivantes concernant le chemin de l'image :
Utilisez-en un :
Définissez le chemin de l'image dans les données :
/*错误写法*/ imgUrl:'../assets/logo.png'
Dans le modèle :
/*错误写法*/ <img src="{{imgUrl}}">
Ce qui précède est une manière d'écrire incorrecte, nous devrions utiliser v - bind lie l'attribut src de l'image :
<img :src="imgUrl"> //或者 <img src="../assets/logo.png">
Cette méthode fait référence au chemin selon la syntaxe HTML normale et peut être empaquetée par webpack lorsqu'elle est placée dans le modèle.
Utilisez 2 :
Lorsque nous devons écrire le chemin de l'image dans le code js, si nous l'écrivons dans les données, webpack le traitera uniquement comme une chaîne et ne trouvera pas l'adresse de l'image . ,
écriture incorrecte
imgUrl:'../assets/logo.png'
A ce moment, nous pouvons utiliser l'importation pour introduire le chemin de l'image :
<img :src="imgUrl" /> import avatar from '@/assets/logo.png'
Définir dans les données : avatar : avatar
Utilisez-en trois :
Nous pouvons également mettre l'image dans le dossier statique externe, puis la définir dans data :
imgUrl : '../../static/logo.png' <img :src="imgUrl" />
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

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

AI Hentai Generator
Générez AI Hentai gratuitement.

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)

Lorsque nous utilisons le framework Vue pour développer des projets front-end, nous déploierons plusieurs environnements lors du déploiement. Souvent, les noms de domaine d'interface appelés par les environnements de développement, de test et en ligne sont différents. Comment peut-on faire la distinction ? Cela utilise des variables et des modèles d'environnement.

La différence entre la modularisation et la modularisation : la modularisation est divisée du point de vue de la logique du code ; elle facilite le développement en couches de code et garantit la cohérence des fonctions de chaque module fonctionnel. La composantisation est planifiée du point de vue de l'interface utilisateur ; la composantisation du frontal facilite la réutilisation des composants de l'interface utilisateur.

Ace est un éditeur de code intégrable écrit en JavaScript. Il correspond aux fonctionnalités et aux performances des éditeurs natifs comme Sublime, Vim et TextMate. Il peut être facilement intégré à n’importe quelle page Web et application JavaScript. Ace est maintenu en tant qu'éditeur principal de l'IDE Cloud9 et est le successeur du projet Mozilla Skywriter (Bespin).

vscode lui-même prend en charge les composants de fichiers Vue pour accéder aux définitions, mais la prise en charge est très faible. Sous la configuration de vue-cli, nous pouvons écrire de nombreuses utilisations flexibles, ce qui peut améliorer notre efficacité de production. Mais ce sont ces méthodes d'écriture flexibles qui empêchent les fonctions fournies par vscode lui-même de prendre en charge le passage aux définitions de fichiers. Afin d'être compatible avec ces méthodes d'écriture flexibles et d'améliorer l'efficacité du travail, j'ai écrit un plug-in vscode qui prend en charge les fichiers Vue pour accéder aux définitions.

Vue.js est devenu aujourd'hui un framework très populaire dans le développement front-end. À mesure que Vue.js continue d'évoluer, les tests unitaires deviennent de plus en plus importants. Aujourd'hui, nous allons explorer comment écrire des tests unitaires dans Vue.js 3 et fournir quelques bonnes pratiques ainsi que des problèmes et solutions courants.

Avant-propos : Dans le développement de vue3, réactif fournit une méthode pour implémenter des données réactives. Il s'agit d'une API fréquemment utilisée dans le développement quotidien. Dans cet article, l’auteur explorera son mécanisme de fonctionnement interne.

Dans Vue.js, les développeurs peuvent utiliser deux syntaxes différentes pour créer des interfaces utilisateur : la syntaxe JSX et la syntaxe des modèles. Les deux syntaxes ont leurs propres avantages et inconvénients. Discutons de leurs différences, avantages et inconvénients.

Dans le processus de développement réel du projet, il est parfois nécessaire de télécharger des fichiers relativement volumineux, puis le téléchargement sera relativement lent, de sorte que l'arrière-plan peut nécessiter que le front-end télécharge des tranches de fichiers. Par exemple, 1 A. Le flux de fichiers de gigaoctets est découpé en plusieurs petits flux de fichiers, puis l'interface est invitée à fournir respectivement les petits flux de fichiers.
