Wie kann vue.js weniger verbrauchen?

vue.js kann weniger Methoden verwenden: 1. In weniger können wir die Definitionsmethode [@k:v;] und die Verwendungsmethode [@k] in Form von Variablen definieren .

Die Betriebsumgebung dieses Tutorials: Windows10-System, vue2.5.2, dieser Artikel gilt für alle Computermarken.

Empfohlene verwandte Artikel: vue.js

vue.js kann weniger Methode verwenden:

Abhängigkeits-Download

npm install --save less less-loader

Referenzmethode

1. Dann erstellen Sie eine. Wir haben angefangen, mit der Vue-Datei zu spielen.

lessc -v

2. String So verwenden Sie Spleißvariablen; <style></style>

import less from 'less'
Vue.use(less)

3. Mehrschichtige Verschachtelung + Variablenberechnung;

<div></div>
 
<style>
@color:red;
@k:100px;
.box{
width:@k;
height:@k;
background: @color;
}
</style>

Sie haben festgestellt, dass die Berechnung wirklich leistungsstark ist?

4. Mischen = Funktion

<div></div>
 
<style scoped>
@img:&#39;./img/&#39;;
@k:100px;
.box1{
    width:@k;
    height:@k;
    background:url("@{img}1.png")
}
</style>

Verwandte kostenlose Lernempfehlungen: JavaScript

Das obige ist der detaillierte Inhalt vonWie kann vue.js weniger verbrauchen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!