![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
治愈系的江予夺
这个作者很懒,什么都没留下…
展开
-
Vue搭载项目初始环境
1.构建开发环境,输入版本号,确定已有开发环境2. 输入命令安装vue-cli,并查看Vue版本号确定OK了。npm install -g @vue/cli如果你需要下载指定版本npm install -g @vue/cli@指定版本号安装完成,检查vue版本3.确定好你需要的创建方式...原创 2020-12-03 16:44:56 · 195 阅读 · 0 评论 -
Vue+ElementUI+VueRouter实现左边导航栏切换页面内容组件显示
显示效果如下:效果说明:实现左边导航栏这一效果就得借用到ElementUI组件中关于导航菜单的使用,NavMenu 导航菜单,这个是为网站提供导航功能的菜单样式。而点击导航栏能够实现内容页面的切换主要是依赖于VueRouter功能。左边点击导航栏进行导航时,路由切换到对应的页面,这里需要使用 <router-link><router-link>组件可以支持在具有路由功能的应用中 (点击) 导航, 通过to属性指定目标地址,默认渲染成带有正确链接的<a>标签,原创 2020-08-28 09:07:57 · 7959 阅读 · 0 评论 -
Vue+ElmentUI在table表格中表头位置插入Dropdown下拉菜单实现过滤效果
效果说明:在el-table的表头插入一个下拉菜单Dropdown鼠标悬停下拉框浮现,点击下拉框选项就可以进行页面信息过滤。预览效果图:功能代码实现+说明:1. 首先需要在表格里的表头位置加入下拉框 ,需要通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单。所以就有slot="header"这个具名插槽引入。这段可参看图片中的第一条横线位置2. 设置鼠标悬停时就能出现下拉菜单,这个要用到trigger这个属性,这个属性是用来控制下拉框的出现。默认情原创 2020-08-22 22:22:13 · 3358 阅读 · 0 评论 -
Vue关于轮播设计与轮播组件的实现
轮播设计 实现轮播效果,首先需要在页面运用到我们的swiper轮播组件。<swiper :key="looplist.length"> <div class="swiper-slide" v-for="data in looplist" :key="data.bannerId"> <img :src="data.imgUrl" />原创 2020-07-14 00:14:52 · 401 阅读 · 0 评论 -
Vue+ElementUI实现下拉框二级联动搜索效果
(一)预计效果预览展示 预计初始显示效果如下图所示: 一旦在下拉框点击选项卡的内容进行选择后,下一个下拉框会在页面上显示出来,在下一个下拉框选择好后,就可以实现级联搜索了。(二)如何实现? 1.需要写入两个下拉框写入代码里面,并将我们要渲染的数据与下拉框进行一个绑定。原创 2020-07-10 17:14:45 · 7876 阅读 · 4 评论 -
为什么Vue打包出来的项目是空白页面?
有时候稍微没注意,用Vue打包出来的项目经过本地直接打开时发现竟然是空白页面! 1. 最直接的原因就是在打包项目的时候忘记创建vue.config.js文件了,这个时候在原Vue项目底下新建vue.config.js文件,内容为:module.exports = { publicPath:'/', out原创 2020-07-08 19:51:30 · 3161 阅读 · 0 评论 -
Vue:npm ERR!missing script:build
今天写到一篇博客,标题用了自己的代码提示报错信息。提交的时候,系统提示我标题含有非法字符,所以就不能发布文章。一开始很奇怪为什么会这样,仔细检查也没有发现标题有什么敏感词汇。尝试着各种修改,各种查询。后面发现,目前会提示这样的标题含有非法字符信息的原因:1)标题含有的转义字符,不可以直接作为标题发出去2)标题的文字环境需要是在中文环境下进行书写。...原创 2020-06-29 11:39:38 · 2412 阅读 · 0 评论 -
Vue渲染后再刷新页面为什么就没有显示数据了?
如果在写页面的时候可以显示数据,一刷新页面后显示的数据又没有了。其实这个问题也可以按照下面的方法进行排查,而前面出现数据的原因只不过是之前加载数据的缓存数据而已,一旦清除缓存,那些也不存在,所以,依然要对自己的代码进行系列的排查,看看是否请求对了,传参过去了,有拿取到响应数据吗?1.直接在页面上写出渲染数据名称{{数据名称}},刷新后再在页面上看是否在页面上有渲染成功的数据。2.如果还是没有数据,可以尝试去打印par原创 2020-07-08 15:51:48 · 5023 阅读 · 0 评论 -
Vue如何将获取到的时间戳对象转为日期格式?
在开发过程中获取的时间可能获取到的是一段时间戳,这样的数据显示在页面上会影响页面的美观效果,所以大多时候会直接将获取到的时间戳转换成日期格式显示出来.(1)确保自己的数据已经能显示在页面上可以看到了,否则你转换成功也显示不出来你的转换效果(2)在跟自己书写的同页面下新建一个filter文件夹用于存放自己转换日期的js文件书写如下代码:export function dateParse(dataStri原创 2020-07-01 11:43:47 · 1686 阅读 · 2 评论 -
[Vue warn]: Invalid prop: type check failed for prop “xxx“.Expected Boolean, got String with value
在输入框中使用clearable属性即可得到一个可清空的输入框,所以常常会用到这个属性。但是在使用时打开控制台提示出现了下面这条标红的信息。[Vue warn]: Invalid prop: type check failed for prop "clearable". Expected Boolean, got String with value "true".控制台显示如下:一开始以为是否是自己语法写错了,打开原创 2020-06-29 11:29:49 · 13142 阅读 · 0 评论 -
如何将基于Vue的手机移动端开发项目进行APP项目打包?
1.找到项目文件夹新建vue.config.js(新建文件与package.json同级)module.exports = { publicPath:'/', outputDir:'dist', assetsDir:'static'}2.打开项目router文件夹底下的index.js 最底下的mode:'history'改成 mode:'hash'注意 两种路由方式:hash与history的区别1)原创 2020-06-09 22:36:03 · 1222 阅读 · 0 评论 -
Vue:These relative modules were not found
Vue框架总是不断更新所以在学习过程中也会经常容易出现一些小错误而导致无法实现一些相关操作。尤其是正在学习的新手,是经常且很容易因为疏忽而踩坑的。以下将针对Vue的学习过程中出现的一些踩坑雷区进行适当的汇总吧。1. These relative modules were not found: 出现这个问题时应该是意味着你的在进行原创 2020-05-31 20:08:46 · 6469 阅读 · 0 评论