vue语法及使用
关注
分享
扫一扫
vue的相关语法及使用
sheerhr
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
对element ui中的分页组件进行二次封装
文章目录一、子组件怎么向父组件传值二、封装分页组件总结 本节要掌握的几个概念 sync 一、子组件怎么向父组件传值 通过$emit向父组件派发一个事件并传递参数 handleSizeChange(val = this.limit) { this.$emit("update",val); }, 父组件中只需要接受这个事件并处理就行了 v-on:update = "pagesize = $event" 也可以写成这样原创 2021-03-15 17:18:32 · 388 阅读 · 1 评论 -
11.props的简写方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jsx语法规则</title> <style> .title { background-color: orange; width: 200px; } </style&g原创 2021-01-13 17:41:13 · 452 阅读 · 0 评论 -
9.$nextTick
<div id="app"> <button @click="get" ref="get">{{test}}</button> </div> <script> var app = new Vue({ el: '#app', data:{ test:"haha" }, ...原创 2020-12-09 14:10:44 · 95 阅读 · 0 评论 -
vuex的基本概念及用法
store页面中的配置信息 import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export default new Vuex.Store({ //存贮store中的数据 state: { counter: 0 }, //相当于store中的计算属性 getters: { plus2(state) { return state.counter%2 == 0?'偶数':'奇数' }原创 2020-11-21 16:00:23 · 160 阅读 · 0 评论 -
Vue.use()和全局混入
//通过全局方法 Vue.use() 使用插件， //Vue.use 会自动阻止多次注册相同插件， //它需要在你调用 new Vue() 启动应用之前完成，Vue.use() 方法至少传入一个参数， //该参数类型必须是 Object 或 Function，如果是 Object 那么这个 Object 需要定义一个 install 方法， //如果是 Function 那么这个函数就被当做 install 方法。 Vue.use(VueRouter) //全局混入 一旦使用全局混入对象，将会影响原创 2020-11-19 15:43:03 · 364 阅读 · 0 评论 -
vue mixins
export const toggleshow = { data() { return { show:true, } }, methods: { toggleshow() { this.show = !this.show; } }, } <template> <div> <p v-if="show">原创 2020-11-19 09:50:20 · 81 阅读 · 0 评论 -
vue中的插槽
父组件 <template> <div id="app"> <img src="./assets/logo.png"> <!-- 绑定的users属性即为子组件users中的props中定义的users属性 --> <!-- msg属性users组件并没有在props中声明，那么这些属性会被收集到子组件的$attrs中 --> <users :users="users" msg="老爹说这些儿子都不行"&g原创 2020-11-17 15:09:29 · 132 阅读 · 0 评论 -
vue中组件通信
父组件 <template> <div id="app"> <img src="./assets/logo.png"> <!-- 绑定的users属性即为子组件users中的props中定义的users属性 --> <!-- msg属性users组件并没有在props中声明，那么这些属性会被收集到子组件的$attrs中 --> <users :users="users" msg="老爹说这些儿子都不行"&g原创 2020-11-16 16:35:11 · 84 阅读 · 0 评论 -
v-model相当于一个语法糖
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc原创 2020-11-03 21:16:10 · 625 阅读 · 0 评论 -
计算属性与监听器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .active {原创 2020-11-02 17:40:13 · 101 阅读 · 0 评论 -
vue标签绑定class和style
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .active {原创 2020-11-02 16:08:10 · 107 阅读 · 0 评论