随笔分类 -  vue

vue使用
vue3使用clipboard
摘要：<div class="content-link"> <span id="link" class="content-link-url ellipsis">{{ userInfo?.user.referralUrl }}</span> <CopyIcon @click="copyUrl" class= 阅读全文
posted @ 2023-01-04 17:38 生命在于折腾Up 阅读(1043) 评论(0) 推荐(0)
vue 超出两行显示查看更多按钮
摘要：JS 部分为 Vue3 版本写法 <!--描述--> <div class="brand-info-desc"> <input id="btn-input" class="btn-input" v-model="checkbox" type="checkbox"> <div class="text" 阅读全文
posted @ 2022-11-23 15:20 生命在于折腾Up 阅读(2592) 评论(0) 推荐(0)
i18n 给变量单独设置样式
摘要：template： <i18n path="totalBuy" tag="span" :for="item.purchaseMboxAmount"> <span class="item-text">{{ item.purchaseMboxAmount }}</span> </i18n> 翻译： { 阅读全文
posted @ 2022-10-11 17:07 生命在于折腾Up 阅读(295) 评论(0) 推荐(0)
vue3 匹配没有的路由跳转到404或者首页
摘要：{ path: '/:pathMatch(.*)', redirect: '/home', }, 阅读全文
posted @ 2022-09-02 10:11 生命在于折腾Up 阅读(428) 评论(0) 推荐(0)
双层数组异步处理
摘要：需求为data数据中，多个数组，数组中的项对应一个盒子，盒子需要有逐个开启的动画。如下例子为 Vue3 const itemArr = Array(15).fill(1) const itemArr2 = Array(10).fill(2) const dataArr = [ { title: 'C 阅读全文
posted @ 2022-08-30 14:55 生命在于折腾Up 阅读(120) 评论(0) 推荐(0)
el-button 实现渐变边框 + 渐变文字
摘要：<div class="create-btn-wrap"> <div class='border-bg'></div> <el-button class="create-button"> <el-image :src="require('@/assets/images/icons/plus.svg' 阅读全文
posted @ 2022-08-04 14:55 生命在于折腾Up 阅读(1100) 评论(0) 推荐(0)
vue-element-admin 页签切换保留滚动位置
摘要：因为项目中引入了 @vue/composition-api ，因此以下代码为 vue3 + vue2 写法（因为vue-router 3版本不能在 steup 中使用），有好的建议可以提一下~~ import {onActivated, getCurrentInstance } from '@vue 阅读全文
posted @ 2022-07-27 18:36 生命在于折腾Up 阅读(529) 评论(0) 推荐(0)
vue.config.js 配置全局 sass变量
摘要：在 module.exports 中加入以下代码，@ 代表 src 目录 module.exports = { css: { loaderOptions: { sass: { // 全局sass变量 additionalData: `@import "@/style/scss/common.scss 阅读全文
posted @ 2022-06-23 20:01 生命在于折腾Up 阅读(860) 评论(0) 推荐(0)