Vue
¥
html5 css3 js vue react
展开
-
vue-day08 vuex
vue-day08 1.vuex 什么是vuex? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 1.安装 npm i vuex --save 2.引入 main.js // import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) new Vue({ el: '#app', router, store:new Vuex原创 2020-12-02 21:43:50 · 127 阅读 · 0 评论 -
vue-day07 路由守卫,axios
vue-day07 1.字体图标使用 1.先下载iconfont 2.导入css以及font 在asset文件夹中 3.在需要位置直接添加类名即可 <i class="iconfont icon-fanhui" @click="$router.go(-1)">返回</i> 2.路由守卫 1.门岗----验证身份 全局守卫 出来----可验证可不验证 1.router->index.js中 在导入router之前 // 全局守卫 router.be原创 2020-12-02 21:42:51 · 222 阅读 · 0 评论 -
Vue day06 路由
Vue day06 路由 补充 父传子props的约束条件: 父传子:子接收用对象方式,那么可以增加约束条件 在child.vue中 props: { msg:{ // 必填项 required:true, // 值得类型 type:Boolean }, cont:{ // 参数默认值 default(){ return '请输入内容原创 2020-12-02 21:41:02 · 126 阅读 · 0 评论 -
Vue day05 组建通信,(父传子,子传父,兄弟之间数据切换,is,jq,slot,ref)
Vue day05 组建通信,(父传子,子传父,兄弟之间数据切换,is,jq,slot,ref) 1.组建通信 a.父传子 1.父传子:传递的是基础数据类型 给父组件中的子组件绑定属性,此时属性的值在父组件中已经定义,子组件需要通过porps接收,要用数组接收 在子组件中直接渲染接收到的值即可 2.父传子:子修改父组件传递的值报错,如果解决,把父组件传递过来的值变为自己的属性,直接修改自己属性即可。后果:父组件修改不会影响自己的数据 3.父传子:父变,子变,子变,父变,需要在父组件中定义对象,传递给子组原创 2020-11-28 23:32:14 · 240 阅读 · 0 评论 -
Vue day04 组件和模块化,生命周期完善
Vue day04 组件和模块化,生命周期完善 1.组件(component) 特点:一组可服用的Vue实例 2.组件和模块化 特点:一个具有html,css,js的页面 用法: 全局定义:(要写在实例之前 new Vue之前) //全局定义 Vue.component('vTwo',{ template:'<p>第二个</p>' }) 局部定义:(+嵌套) <div id="app">原创 2020-11-27 17:27:54 · 176 阅读 · 0 评论 -
Vue day03 (watch监听,过滤器filters,计算属性)
Vue day03 (watch监听,过滤器filters,计算属性) 1.watch监听 特点:一个数据影响多个数据 案例:百度搜索框 接口:百度:http://suggestion.baidu.com/su?cb=callback&wd=123 1.深浅监听 watch:{ //浅监听 msg(newVal,oldVal){ console.log(newVal,oldVal) }, //深监听 json:{ //这个名字不能更原创 2020-11-27 17:27:00 · 173 阅读 · 0 评论 -
Vue day01 vue初识
day-01 vue初识 一.认识vue 1.vue特点 易用,灵活,高效 2.核心 数据驱动 组件化 3.安装方式 <!-- 安装 --> <!-- 1. <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> --> <!-- 2. npm install npm --> <!-- 3. <s原创 2020-11-27 17:25:24 · 111 阅读 · 0 评论 -
Vueday02 表单,修饰符,鼠标键盘事件修饰符,表单修饰符,生命周期,动画,解决数据无法渲染的问题
Vueday02 表单,修饰符,鼠标键盘事件修饰符,表单修饰符,生命周期,动画,解决数据无法渲染的问题 1.表单 1).单选框的使用,绑定的值一定要与value值保持一致,提交还是会提交value的值 通过v-model来绑定data里面的属性实现双向绑定,文本框内容的修改会影响绑定值的修改 <div>用户名: <input type="text" v-model='name'> </div> <!-- 单选框的使用 绑定的属性一定要与value的值保持一致原创 2020-11-27 17:23:01 · 249 阅读 · 0 评论