![](https://img-blog.csdnimg.cn/20190918140053667.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
vue
弹指歌丶
立于浮华之世,奏响天籁之音。
展开
-
vue项目部署到非根路径时需要进行的修改
vue项目部署到非根路径时需要进行的修改由于项目需要,我们将项目部署到了非根路径原创 2020-11-18 00:04:20 · 440 阅读 · 0 评论 -
element-ui使用Message,出现相同消息提示时只弹出一个的解决方案
最近在项目的使用过程中,出现了网络异常时所有接口同时报了同样的错误消息提示,所以为了解决这个问题决定要出现相同的消息时只弹出一个提示框。在这里我找到了以下两篇文章:https://blog.csdn.net/dongguan_123/article/details/101290164https://blog.csdn.net/Linho/article/details/105856686创建一个js文件/**重写elemen-ui的message,防止出现同一时间弹出多个相同信息的messag原创 2020-08-17 17:49:02 · 1696 阅读 · 0 评论 -
element-ui的el-autocomplete组件(带建议的输入框)根据输入进行提示,并在以特定符号分割时重新提示
需求我这里需要对用户输入的内容进行提示,然后用户输入了特定的分割符号时,重新匹配提示遇到的问题以及解决问题方法这个组件本身是点击某个建议就将对应的value直接赋值给v-model绑定的值,所以不符合现在的需求,这里赋的值需要更改为“最后一个分割符号及其之前的值 + 所点击的建议项的值”。解决的方法是在返回建议项的方法中(fetch-suggestions),给每一个建议项添加一个msg的属性用于存储输入框中应该展示的值,之后在点击建议项的回调函数中(select)将msg的值赋值给v-model绑原创 2020-08-03 01:00:04 · 1215 阅读 · 0 评论 -
基于vuedraggable实现拖拽排序组件
基于vuedraggable实现拖拽排序组件安装npm install vuedraggable引入import draggable from 'vuedraggable'使用<template> <section id="home"> <article class="container"> <div class="middle"> <draggable v-model="middleContent" hand原创 2020-06-27 23:53:42 · 468 阅读 · 1 评论 -
vue + element-ui + vue-i18n 前端国际化
vue + element-ui 前端国际化项目要求支持中英双语,所以就进行了一下前端的国际化,我这里是使用了vue-i18n,下面是我进行的步骤package.json中dependencies节点添加vue-i18n"vue-i18n": "7.3.2",src目录下创建lang目录,存放国际化文件,分别创建index.js、en.js、zh.js三个文件// index.jsimport Vue from 'vue'import VueI18n from 'vue-i18n'原创 2020-11-24 01:15:10 · 467 阅读 · 0 评论 -
对vue服务端渲染的理解以及其使用场景
理解本质上,服务端渲染其实是生成了应用程序的“快照”,将vue及其对应的库运行在服务端,令其去访问接口去预加载数据,然后将获取到的数据作为组件的初始状态首先拉取数据,此后,组件的beforeCreate和created生命周期会在服务端调用,初始化完成后将生成的html字符串交由客户端浏览器托管,继续进行挂载,从而实现前后端同构优点由于搜索引擎爬虫抓取工具可以直接查看到已经完全渲染了的页面,所以可以达到更好的 SEO可以具备更快的首屏内容到达时间,特别是对于缓慢的网络情况或运行缓慢的设备比如原创 2020-09-03 00:27:52 · 442 阅读 · 0 评论 -
Vue项目实践(1)
项目配置策略基础配置:指定应用上下文、端口号,vue.config.js修改后需要重启const port = 7070;module.exports = { publicPath: '/practice', // 部署应⽤包时的基本 URL devServer: { port, } }配置webpack:configureWebpack我们在项目过程中主要也是与wepack打交道,所配置的选项都会与原有的进行合并webpack-merge 合并出终选项对象形式配置:不是特原创 2020-07-21 02:43:57 · 2495 阅读 · 0 评论 -
vue组件化相关:组件间通信及插槽
组件化vue组件系统提供了⼀种抽象,让我们可以使⽤独⽴可复⽤的组件来构建⼤型应⽤,任意类型的应⽤界 ⾯都可以抽象为⼀个组件树。组件化能提⾼开发效率,⽅便重复使⽤,简化调试步骤,提升项⽬可维护 性,便于多⼈协同开发。组件通信常⽤⽅式propseventvuex自定义事件边界情况$parent$chidren$root$refsprovide/inject非prop特性$attrs$listeners组件通信props父给子传值// childpro原创 2020-07-05 16:57:10 · 177 阅读 · 0 评论