vue
dalalalaa
喜欢码代码且不秃头的咿咿呀呀哒啦啦啦的小钟~~
展开
-
图片通过axios请求返回实现头部加鉴权
图片通过axios请求返回实现头部加鉴权原创 2022-11-08 14:44:14 · 318 阅读 · 0 评论 -
vue 实现v-model封装组件,并挂载全局
vue实现v-model封装组件,并挂载全局原创 2022-07-15 10:42:28 · 523 阅读 · 1 评论 -
vue 展开收起样式 超出为省略号
效果组件<template> <div class="remark-text"> <div ref="textBox" class="text" :style="{ WebkitLineClamp: minLine ? minLine : 3 }" :class="{ 'all-text': showAll }" > <span class="btn"原创 2022-04-25 16:40:27 · 309 阅读 · 0 评论 -
vue 表格自动滚动 鼠标悬浮停止滚动
vue 表格自动滚动 鼠标悬浮停止滚动组件<template> <div class="main"> <div class="content" ref="list" @mouseover="mouseOver" @mouseleave="mouseLeave" > <slot></slot> </div> <div class="o原创 2022-04-25 16:29:33 · 1087 阅读 · 0 评论 -
vue 音频播放 Audio 不使用插件
<template> <img :src="audio_icon" class="icon_audio" @click="audioClick" /></template><script>export default { props: ['adcd'], name: '', data() { return { canPlay: false, audio_icon: require('../images/a原创 2022-01-07 16:05:42 · 1633 阅读 · 0 评论 -
前端项目常用的工具类函数
话不多说上代码!!!import axios from 'axios';/** * 两个数字相除 * @param {number} n 因为0/0等于NaN */export const notZero = (m, n) => { if (!n || !m) { // Matches +0, -0, NaN return 0; } return m / n;};/** * 下载文件 * @param {String} filename 文件名:登录.原创 2022-01-06 18:06:06 · 285 阅读 · 0 评论 -
vue 批量打包图片为zip压缩包下载
vue 批量打包图片为zip压缩包下载 getFile(url) { return new Promise((resolve, reject) => { this.axios({ method: 'get', url, responseType: 'arraybuffer', }) .then((data) => { resolve(data.d原创 2021-12-28 16:57:30 · 132 阅读 · 0 评论 -
vue 图像拖拽、鼠标滚轮放大缩小
vue 图像拖拽、鼠标滚轮放大缩小//页面<img v-drag @mousewheel.prevent="scaleFun" :style="scaleImg" :src=" dangerImgs[0] ? serverIp + dangerImgs[0] : require('@/assets/images/no-pic.png') "原创 2021-12-28 15:20:25 · 1210 阅读 · 0 评论 -
新建标签页 localStorage、sessionStorage、cookie、vuex数据变化
新建标签页 localStorage、sessionStorage、cookie、vuex数据变化转载: 转载.转载 2021-02-24 12:07:24 · 259 阅读 · 0 评论 -
vue中getters的用法
vue中getters的用法store文件夹下的index.js文件:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({ state: { // 数据源 counter:100, students:[ {id:0,name:'张三',age:80}, {id:1,name:'李四',age:24}, {id:原创 2020-11-11 17:17:20 · 1651 阅读 · 0 评论 -
vue 导航跳转案例
vue 导航跳转案例创建vue项目的配置:选择3.0x版本目录结构:index.js:import { createRouter, createWebHistory } from 'vue-router'const Home=()=>import('../views/home')const Cart=()=>import('../views/cart')const Category=()=>import('../views/category')const Profi原创 2020-11-10 19:24:43 · 519 阅读 · 0 评论 -
vue修改插槽的样式
vue修改插槽的样式方法一:子组件中直接设置颜色子组件<template> <div :class="{active:isActived}"> <slot name="slot-text"></slot> </div></template> <style scoped> .active{ color: dodgerblue原创 2020-11-10 15:00:05 · 3728 阅读 · 0 评论 -
vue不具名插槽与具名插槽
vue不具名插槽与具名插槽需求:面向未来编程,实现在未来中若出现修改内容可以简便的修改,而不需要将全部整改思路:在组件Tabbar.vue(底部导航)当中使用不具名插槽,Tab-bar-item.vue中写具名插槽以便在App.vue中方便获取和更改Tabbar组件:TabBarItem组件(Tab-bar-item.vue):目录:Tabbar.vue<template> <div id="tabbar"> <slot><原创 2020-11-10 14:12:04 · 735 阅读 · 2 评论 -
vue根据参数跳转路由
vue根据参数跳转路由目录结构App.vue<template> <div id="app"> <router-link :to="'/user/'+userId" tag="button">用户</router-link> <router-view></router-view> </div></template><script> export defau原创 2020-11-05 15:22:36 · 242 阅读 · 0 评论 -
vue中父级访问子级与子级访问父级
vue中父级访问子级与子级访问父级父级访问子级通过$children与refs访问<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimu原创 2020-11-02 16:50:50 · 400 阅读 · 0 评论 -
vue中的父组件传递数据给子组件、子组件传递数据给父组件
vue中的父组件传递数据给子组件、子组件传递数据给父组件1、父组件传递数据给子组件中心思想:父组件向子组件传值,需要通过props1.1 父传子数组<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-sc原创 2020-10-30 15:54:57 · 2359 阅读 · 0 评论 -
js高阶函数(基于vue)
js高阶函数1.过滤器原创 2020-10-29 11:17:36 · 130 阅读 · 0 评论