-
開發環境:
webstorm或vscode
推薦webstorm
相關配置:
背景色:深色
font:size=16,行間距1.2
查看全部 -
記錄
查看全部 -
查看全部
-
npm 6.4.1
node 8.12.0
查看全部 -
知識圖
查看全部 -
已經跟著敲了三遍了,最后一遍,記憶更深了。感謝老師講的,只不過只會打這些代碼,不知道用在什么地方。
查看全部 -
地址是:
npm install -g cnpm --registry=https://registry.npm.taobao.org
查看全部 -
地址是:
npm install -g cnpm --registry=https://registry.npm.taobao.org
查看全部 -
查看服務器上有的版本
nvm?
node
npm?
解決npm下載慢的問題
查看全部 -
語法
v-for
v-if
v-else
v-show
查看全部 -
說說啊啊啊啊啊啊啊啊啊啊1234556查看全部
-
學習vue制作移動端web
查看全部 -
<template>
?<ul>
? ?<!--@click點擊選中樣式-->
? ?<!--:class選中樣式,僅在current等于某個索引時且current不為空時生效-->
? ?<li v-for="(item,index) in lists"
? ? ? ?@click="choose(index)"
? ? ? ?:class="{active: index == current && current !== ''}"
? ? ? ?:key="index">
? ? ?{{item}}
? ?</li>
?</ul>
?<button type="button" @click="add()">添加</button>
?<!--輸出target-->
?<ul>
? ?<li v-for="(item,index) in target" :key="index">{{item}}</li>
?</ul>
</template>
<script>
?export default {
? ?name: 'Info',
? ?data () {
? ? ?return {
? ? ? ?current: '',
? ? ? ?lists: [1,2,3,4,5,6,7,8,9],
? ? ? ?target: []
? ? ?}
? ?},
? ?methods:{
? ? ?//選中時改變current的值
? ? ?choose (index){
? ? ? ?this.current = index;
? ? ? ?console.info(index);
? ? ?},
? ? ?//點擊添加按鈕時把當前選中值加到目標數組
? ? ?add(){
? ? ? ?if(this.current === ''){ ?//為空時不添加
? ? ? ? ?return;
? ? ? ?}
? ? ? ?this.target.push(this.lists[this.current]);
? ? ? ?/*添加后清空*/
? ? ? ?this.current = '';
? ? ?}
? ?}
?}
</script>
<style scoped>
? ?/*選中的li加背景色*/
? ?li.active{
? ? ?background:green;
? ?}
</style>查看全部 -
課程安排
查看全部 -
vue通過使用var賦值,來進行瀏覽器調試
查看全部 -
定義watch之后,對app中的msg進行修改值后,可以觀看到值發生了變化。
通過以上,可以發現computed他倆展示的效果一樣,那么他們的區別在哪里?
通過上面發現,wathch只能監聽他自己定義的變量名。computed可以監聽實例里面的所有值。
在computed中return了this.arr; 重新定義了arr之后,發現值也跟著發生變化。說明computed可以監聽到實例后的變量。
watch:一個變量或一個常量
computed:多個變量
查看全部 -
模板語法:
查看全部 -
Demo:
<head>: 引入樣式文件、js庫等
????推薦網站bootcdn,引入vue的js文件
<body> script,new vue 對象
????el:綁定元素
????data: 關聯數據,使用{{}}關聯具體的數據名稱?
查看全部
舉報