| key |
vue3 |
defineComponent |
defineComponent |
ref |
ref |
reactive |
reactive |
computed |
computed |
getCurrentInstance |
getCurrentInstance |
onMounted |
onMounted |
toRefs |
toRefs |
setup () |
setup () { return {} } |
toRefs |
toRefs |
watch |
watch |
watchEffect |
watchEffect |
readonly |
readonly |
useStore() |
useStore() |
| key |
import |
import '' |
import ' ' |
import from '' |
import from '' |
ivue |
import { } from 'vue' |
ivueall |
import { ... } from 'vue' |
icomputed |
import { computed } from 'vue' |
idefineComponent |
import { defineComponent } from 'vue' |
ireactive |
import { reactive } from 'vue' |
iref |
import { ref } from 'vue' |
itoRefs |
import { toRefs } from 'vue' |
icreateStore |
import { createStore } from 'vuex' |
iuseStore |
import { useStore } from 'vuex' |
iglobal |
import './assets/global.css' |
irouter |
import router from './router' |
istore |
import store from './store' |
ivue-router |
import { createRouter, createWebHistory } from 'vue-router' |
| key |
const |
creactive |
const data = reactive({}) |
croutes |
const routes = [{...}] |
crouter |
const router = createRouter({...}) export default router |
cstore |
const store = createStore({...}) export default store |
| key |
vue2 |
template |
<template></template> |
script |
<script></script> |
export default |
export default { } |
style |
<style></style> |
lang="less" |
lang="less" |
scoped |
scoped |
data () |
data () { return { }} |
mounted () |
mounted () { } |
created () |
created () { } |
methods: |
methods: { } |
computed: |
computed: { } |
watch: |
watch: { } |
components: |
components: { } |
props: { } |
props: {'',} |
props: [ ] |
props: [''] |
this.$emit() |
this.$emit('',) |
this.$router.push |
this.$router.push |
router-view |
<router-view></router-view> |
| key |
element-plus |
elementPlus |
import ElementPlus from 'element-plus' |
|
import 'element-plus/lib/theme-chalk/index.css' |
|
import locale from 'element-plus/lib/locale/lang/zh-cn' |
|
const app = createApp(App) |
|
app.use(ElementPlus, { locale }) |
el-container |
<el-container></el-container> |
el-aside |
<el-aside></el-aside> |
el-header |
<el-header></el-header> |
el-main |
<el-main></el-main> |
el-button |
<el-button type="primary" @click=""></el-button> |
el-input |
<el-input v-model=""></el-input> |
el-menu |
<el-menu ...><el-menu-item ...></el-menu-item></el-menu> |
el-tooltip |
<el-tooltip ...></el-tooltip> |
router |
router |
index='' |
index='' |
route='' |
route='' |
this.$message.success() |
this.$message.success('') |
this.$message.error() |
this.$message.error('') |
this.$message.info() |
this.$message.info('') |
this.$message.warning() |
this.$message.warning('') |
| key |
js |
console.log |
console.log('',) |
parseInt() |
parseInt() |
.toString() |
.toString() |
typeof() |
typeof() |
localStorage.setItem() |
localStorage.setItem('', ) |
localStorage.getItem() |
localStorage.getItem('') |
localStorage.removeItem() |
localStorage.removeItem('') |
localStorage.clear() |
localStorage.clear() |
sessionStorage.setItem() |
sessionStorage.setItem('', ) |
sessionStorage.getItem() |
sessionStorage.getItem('') |
sessionStorage.removeItem() |
sessionStorage.removeItem('') |
sessionStorage.clear() |
sessionStorage.clear() |
JSON.parse() |
JSON.parse() |
JSON.stringify() |
JSON.stringify() |
eval() |
eval() |
| key |
css |
global |
html,body,#app { height:100%; margin:0; padding: 0;} |
| |
