vue
Melhor_
这个作者很懒,什么都没留下…
展开
-
Vue父、子组件数据的双向绑定.sync
//父组件<div> <hello-world :name.sync="value"> </hello-world> <h1>父组件</h1> <input type="text" v-model="value"> </div><script>import HelloWorld from './components/HelloWorld.vue';export def原创 2021-02-22 10:03:38 · 121 阅读 · 0 评论 -
vue项目搜索框搜索功能
原创 2021-02-19 16:45:33 · 602 阅读 · 0 评论 -
es6 中Promise的使用
0.Promise的介绍1.Promise 是什么是一种异步解决的方案 对比es5传统的解决异步的方案(回调函数,会产生回调地狱问题)1.第一中使用方法,实现类似抛硬币正反面。var p= function(){ return new Promise((res, rej)=>{ if (Math.random() < 0.5) { res() } rej() }) } p().then(res=原创 2020-11-24 19:53:53 · 79 阅读 · 0 评论 -
Vuex常见使用场景和Vuex中数据缓存的使用
Vuex异步请求使用场景一般是在两个列表中重复请求数据,可以将数据存储在store中,在用户频繁请求时,可以不必要多次的使用ajax请求获取数据,而是直接在store中拿已经缓存的数据(store中的数据是缓存在内存中的,只要网页一刷新或者关闭,缓存的数据就会丢失。)Vuex状态管理 功能、使用场景。1.状态管理(给父子组件之间的通信)2.数据快照(数据的缓存)3.方便管理和调试。下面是Vuex数据缓存的使用。1.在组件中判断是否有缓存的数据,如果没用,就发ajax请求,如果有就直接从store原创 2020-11-14 21:43:45 · 2038 阅读 · 0 评论 -
Vuex状态管理机制的基本使用
安装vuex,创建一个store文件夹index.js文件npm install vuex2.在index.js文件中导入vue和vuex,并全局使用vueximport Vue from "vue"import Vuex from 'vuex'Vue.use(Vuex)//全局使用Vuex//new 一个Vuex.Store({)}仓库export default new Vuex.Store({ //自定义共享状态 state: { isShow: true, .原创 2020-11-14 20:40:17 · 112 阅读 · 0 评论 -
动态路由使用
1.指定动态路由路径,创建一个username数组,返回一个空username数组,双向绑定username//App.vue<template> <div id="app"> <input type="text" v-model="username"> <router-link to="/home">主页</router-link> <router-link to="/about">关于&l原创 2020-08-24 16:40:11 · 752 阅读 · 0 评论 -
vue-slot 插槽的使用以及居民插槽
一般在swiper 轮播子组件上使用。父组件apptest-slot> <h3 slot="aaa">aaa插槽的使用</h3>//具名插槽 <h3 slot="bbb">bbb插槽的使用</h3></test-slot>子组件testSlot<div> <h2>slot插槽的使用 具名插槽</h2> <slot></slot>//插槽的使原创 2020-11-11 20:18:50 · 161 阅读 · 0 评论 -
vue -非父子通信 事件总线 bus 在简单的场景下使用,复杂时候用vuex
有时候两个组件也需要通信(非父子关系)。当然Vue2.0提供了Vuex,但在简单的场景下,可以使用一个空的Vue实例作为中央事件总线。使用var Bus = new Vue()实例化Bus.$on(“busName”){} 监听Bus.$emit(“busName”) 触发/可以设一个点击事件触发或者使用mounted()声明周期挂载 在组件加载完后触发。1.实际运用的时候一般把bus抽离出来;Bus.jsimport Vue from 'vue'const Bus = new Vue()原创 2020-11-10 23:09:32 · 216 阅读 · 0 评论 -
vue中的ref之间的通信
vue文档对ref的官方解释是:ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素;如果用在子组件上,引用就指向组件实例:<!-- `vm.$refs.p` will be the DOM node --><p ref="p">hello</p><!-- `vm.$refs.child` will be the child component instan原创 2020-11-10 22:11:51 · 732 阅读 · 0 评论 -
vue反向代理 vue 中使用axios请求数据解决跨域问题
在使用vue cli3.x之后创建vue项目,项目结构发生了较大的改变,不在存在vue.config.js配置文件,需要手动创建该文件,如果项目的 (和 package.json 同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的 vue 字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。决解方法:以请求百度为例 https://www.baidu.com在vue.config.js文件创建,添加 dev原创 2020-11-10 19:02:29 · 320 阅读 · 0 评论 -
Vue filter格式化时间戳时间成标准日期格式的方法
Vue filter格式化时间戳时间成标准日期格式的方法<template> <!--过滤器案例:格式化日期(使用的时网上封装好的方法)--> <div> 日期:{{time | format('yyyy-MM-dd hh:mm:ss')}} </div></template><script> import Vue from "vue" /*创建全局过滤器,需要在Vue实例之前定义*/ Vue.f原创 2020-09-23 17:01:21 · 652 阅读 · 0 评论 -
webstorm打包vue项目
router->index.jsconst router = new VueRouter({ routes, //去掉# 启动history模式 // mode:'history' mode:'hash'})vue.config.jsmodule.exports = { configureWebpack:{ resolve:{ // 配置末尾.js vue // extensions:[] // 配置别名 alias原创 2020-08-12 01:36:11 · 641 阅读 · 0 评论