会员
周边
众包
新闻
博问
闪存
赞助商
所有博客
当前博客
我的博客
我的园子
账号设置
简洁模式
...
退出登录
注册
登录
此夏
博客园
首页
新随笔
联系
管理
订阅
[置顶]
Vue+Element+Select获取选中的对象
摘要: 为大家推荐好听的歌 案例演示:获取select当前选中的所有内容 1 <el-select v-model="value8" filterable placeholder="请选择" value-key="id" @change="currentSel"> 2 <el-option v-for="i
阅读全文
posted @ 2019-03-20 00:10 此夏_唯美
阅读(44375)
评论(2)
推荐(2)
编辑
[置顶]
Vue+Element+computed实现购物车
摘要: 本人写的小程序,功能还在完善中,欢迎扫一扫提出宝贵意见! 该购物车效果采用的是Element-ui库实现的。 采用了computed计算属性来实现逻辑操作。 功能分析: 全选/全不选/单选; 数量增加、数量减少; 总金额 = 数量 * 单价; 商品总价:每一项的总金额相加; 新增、编辑功能; 删除功
阅读全文
posted @ 2019-03-17 12:32 此夏_唯美
阅读(3543)
评论(1)
推荐(3)
编辑
[置顶]
Vue2.0选中当前鼠标移入移除加样式
摘要: 顺便为大家推荐好听的歌曲 效果如gif动态图所示: 1、通过v-for遍历数组 HTML代码: 1 <template> 2 <div class="nav"> 3 <div class="nav-item" v-for="(item,index) in items" :key="index" @m
阅读全文
posted @ 2018-05-05 17:24 此夏_唯美
阅读(8149)
评论(0)
推荐(0)
编辑
[置顶]
Vue2.0增删改查案例(Vue+Less+LocalStorage)
摘要: 本人写的小程序,功能还在完善中,欢迎扫一扫提出宝贵意见! Vue+Less+LocalStorage 安装Less:npm install less less-loader --save 项目搭建请看:点击跳转 效果演示:点击跳转 项目地址:点击跳转 后续更新 搜索、全选等功能,敬请期待......
阅读全文
posted @ 2018-04-21 16:28 此夏_唯美
阅读(1172)
评论(0)
推荐(0)
编辑
[置顶]
Vue2.0使用vue-cli脚手架搭建
摘要: 一:安装node.js Node.js官网:https://nodejs.org/en/download/ 选择相应的版本即可安装 通过node自带的npm包管理工具 二、安装依赖 安装依赖:npm install 如果国外安装比较慢,可采用国内淘宝镜像安装:npm install -g cnpm
阅读全文
posted @ 2018-04-21 15:00 此夏_唯美
阅读(529)
评论(0)
推荐(0)
编辑
[置顶]
Vant UI 安装
摘要: 一:安装 二、引入组件(共有三个方法) 方法一:使用 babel-plugin-import (推荐) 1、 安装 babel-plugin-import 插件 2、 在 .babelrc 或 babel-loader 中添加插件配置 请覆盖原先代码否则会报错 3、在代码中引入Vant组件,插件会自
阅读全文
posted @ 2018-03-06 17:24 此夏_唯美
阅读(2323)
评论(0)
推荐(0)
编辑
[置顶]
vue2 商城首页轮播图切换
摘要: home.vue HomeBanner.vue 分三部分: HTML部分代码如下所示: JS部分代码如下所示 CSS部分代码如下所示: 大概步骤就是这样,如若有问题,请留言评论,谢谢合作!!! vue小白交流群,希望能够帮助到大家!
阅读全文
posted @ 2018-01-24 16:24 此夏_唯美
阅读(1781)
评论(0)
推荐(0)
编辑
[置顶]
新手vue构建单页面应用实例
摘要: 本人写的小程序,功能还在完善中,欢迎扫一扫提出宝贵意见! 步骤: 1.使用vue-cli创建项目2.使用vue-router实现单页路由3.用vuex管理我们的数据流4.使用vue-resource请求我们的node服务端5.使用.vue文件进行组件化的开发 一、目录结构: 二、搭建项目 需先安装淘
阅读全文
posted @ 2017-05-18 20:48 此夏_唯美
阅读(21910)
评论(0)
推荐(1)
编辑
2024年10月16日
vue+element+Cascader 级联选择器任意一级选项,去掉单选框radio
摘要: <template> <div class="block"> <h1 class="demonstration">选中的值:{{ value }}</h1> <el-cascader :options="options" v-model="value" popper-class="cascaderB
阅读全文
posted @ 2024-10-16 13:57 此夏_唯美
阅读(19)
评论(0)
推荐(0)
编辑
2024年10月15日
vue+wangEditor编辑器,上传图片请求后台接口
摘要: 来吧,先给大家看一下,是否是你想要的简单轻便编辑器的效果。 父组件: <EditorView :content="value" @change="grtUrl"/> <script> import EditorView from "@/components/EditorView"; export d
阅读全文
posted @ 2024-10-15 15:54 此夏_唯美
阅读(29)
评论(0)
推荐(0)
编辑
2023年6月5日
vue3+vant4+vuex4入门案例
摘要: 案例用的是vant-ui库,你可换成你自己用的ui库即可。 安装vuex依赖包 npm install vuex --save main.js引用vuex,并挂载到vue中 import store from './store'; app.use(router).use(store); add.vu
阅读全文
posted @ 2023-06-05 21:04 此夏_唯美
阅读(349)
评论(0)
推荐(0)
编辑
2023年5月19日
vue3+vant3封装省市区组件
摘要: 因为后台返回的数据格式和vant不一致,所以自己遍历循环得到自己想到的格式。 省市区的接口并不是一个以children格式,一次性全部获取,而是选择市的时候需要得到省的id,一层一层请求接口才能得到省市区。 父组件: 1 <selectArea 2 @addressOnFinish="onChang
阅读全文
posted @ 2023-05-19 19:08 此夏_唯美
阅读(276)
评论(0)
推荐(0)
编辑
2023年4月22日
前端工具vscode将英文设置中文简单方便
摘要: 按照步骤来: 右下角会有提示,点击重启即可 然后vscode就变成中文的了
阅读全文
posted @ 2023-04-22 14:47 此夏_唯美
阅读(32)
评论(0)
推荐(0)
编辑
2023年4月21日
vue3打包后一片空白控制台报错
摘要: 问题原因是路径不对,加上一行代码就可完美解决问题。 在vue.config文件中加上 publicPath:'./' 即可解决问题。 问题如图所示: 如何解决问题呢?
阅读全文
posted @ 2023-04-21 10:47 此夏_唯美
阅读(141)
评论(0)
推荐(0)
编辑
2022年12月8日
vue实现自定义字体库
摘要: 先看效果是不是你所需要的,再看具体如何实现。 效果如下图所示: 有些字体需要下载,用图片就会变得很不清楚,这样我们就需要去下载字体库,操作步骤如下: 首先找到需要下载的字体库 然后放在项目里面 然后定义字体库名 最后引用字体库名 第一步:通过第一字体库链接下载字体库,https://www.diyi
阅读全文
posted @ 2022-12-08 21:32 此夏_唯美
阅读(1074)
评论(0)
推荐(0)
编辑
2021年9月10日
element-ui跨行
摘要: 1 <template> 2 <el-table :data="scheduleList" :span-method="objectSpanMethod" border> 3 <el-table-column prop="date" label="时间" width="200" /> 4 <el-t
阅读全文
posted @ 2021-09-10 18:21 此夏_唯美
阅读(364)
评论(0)
推荐(0)
编辑
2021年6月2日
Element-ui树形控件el-tree鼠标移入显示隐藏效果超简单
摘要: 显示效果: 废话不多说,直接上代码 <template> <el-tree default-expand-all :data="data"> <span class="custom-tree-node" slot-scope="{ node, data }" style="width:100%;"
阅读全文
posted @ 2021-06-02 15:26 此夏_唯美
阅读(2118)
评论(0)
推荐(0)
编辑
2020年12月11日
vue表格拖拽使用Sortable插件库
摘要: 1 <template > 2 <el-table 3 row-key="name" 4 :data="tableData" 5 stripe style="width:100%;"> 6 <el-table-column prop="name" label="测试"></el-table-colu
阅读全文
posted @ 2020-12-11 16:23 此夏_唯美
阅读(229)
评论(0)
推荐(0)
编辑
下一页
公告