?

事件修飾符

stop 禁止冒泡
once 單次事件
prevent 阻止默認事件
native 原生事件（組件）
keycode|name 篩選按鍵? ?組合鍵 ： @keydown.ctrl.enter

self
capture

--------------------------------------------------------------------------------

@click="fn()"
@click.stop="fn()"

--------------------------------------------------------------------------------

computed——計算屬性
1.緩存——性能
2.方便
讀、寫
屬性的形式

--------------------------------------------------------------------------------

watch——監聽：

--------------------------------------------------------------------------------

vue-router
數據交互
組件

--------------------------------------------------------------------------------

vue-router
1.容器
<router-view></router-view>

2.路由表
let router=new VueRouter({
routes: [
{path, component},
{path, component},
{path, component},
...
]
});

component里面內容必須要有父標簽

3.添加到vm對象
new Vue({
el, data, ...,
router: router
})

el不要掛載到html, body

--------------------------------------------------------------------------------

router-view 容器
router-link a標簽

路由為什么加# 防止頁面刷新 便于頁面收藏、后退

--------------------------------------------------------------------------------

命名路由

$route：當前路由的信息

--------------------------------------------------------------------------------

<router-link to="/xxx/xxx">
<router-link :to="{name, params}">

命名路由
new VueRouter({
routes: [
{path, component},
{path, name, component},
]
})

routes 的children下path必須寫相對路徑，不能寫絕對路徑

--------------------------------------------------------------------------------

獲取路由信息：$route
JS控制路由跳轉：$router

this.$router.push(
string|object
);

--------------------------------------------------------------------------------

history是一個棧

--------------------------------------------------------------------------------

push(string|object) 入棧
replace(string|object) 替換最后一個歷史紀錄(當前)
go(int)
go(-1)
go(1)

--------------------------------------------------------------------------------

$route 當前路由信息
$router 操作路由

--------------------------------------------------------------------------------

監視路由：
1.watch——不推薦
簡單——只能看不能干預
2."路由守衛"
也能控制

--------------------------------------------------------------------------------

多視圖

npm install module_name -S? ? 即? ? npm install module_name --save? ? 寫入dependencies
npm install module_name -D? ? 即? ? npm install module_name --save-dev 寫入devDependencies

cls 清屏

npm init 用來初始化生成一個新的 package.json 文件。它會向用戶提問一系列問題，如果你覺得不用修改默認配置，一路回車就可以了。
如果使用了 -f（代表force）、-y（代表yes），則跳過提問階段，直接生成一個新的 package.json 文件。

?

轉載于:https://www.cnblogs.com/ckmouse/p/10933868.html

總結

以上是生活随笔為你收集整理的19课 Vue第二节的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。