![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
wandoumm
这个作者很懒,什么都没留下…
展开
-
vue3 svg-sprite-loader
add(resolve('src/components/svgIcon/icon')) //处理svg目录。//重点:删除默认配置中处理svg,// 获取当前svg目录所有为.svg结尾的文件。// 解析获取的.svg文件的文件名称,并返回。6把svg.js 引入main.js文件。7修改vue.config.js文件。5.新建svg.js 文件。4.下载一些svg 图片。原创 2023-02-17 12:48:45 · 1445 阅读 · 1 评论 -
vue3 vite @路径修改
}{}},原创 2023-01-03 15:59:02 · 407 阅读 · 0 评论 -
使用require 模块的二种情况
2.require的模块曾被加载过,这事该模块的代码不会再次执行,直接导出上一次执行的结果。1,require的模块是第一次被加载,这时先执行该模块,然后导出内容。原创 2022-10-31 13:58:45 · 179 阅读 · 0 评论 -
vue3 electron 报错
方式2使用ts-loader@~8.2.0。方式1vue-cli降到4.x版本。原创 2022-07-16 20:49:01 · 364 阅读 · 0 评论 -
vue3 自定义switch
{{state}} import {ref,watch,onMounted,computed} from 'vue' const isOpen = r原创 2022-07-09 19:29:52 · 421 阅读 · 0 评论 -
vue3 接球小游戏
import {reactive,ref,watch,o原创 2022-07-09 16:47:52 · 978 阅读 · 0 评论 -
vue3 随鼠标移动的小球
import {reactive,ref,watch,onBeforeMount,computed} from 'vue'原创 2022-07-09 16:08:56 · 784 阅读 · 0 评论 -
vue3 登陆页面
一起创造美好世界 创建你的账号 {{item.title}}原创 2022-07-09 15:43:45 · 1228 阅读 · 0 评论 -
vue3 computed 里面set get方法使用
{{count}} {{newCount}} add import {reactive,ref,watch,onBeforeMount,computed} from 'vue' const count = ref(0)原创 2022-07-09 12:16:32 · 1499 阅读 · 0 评论 -
vue3 provide,inject使用
父组件 import { provide,inject,ref,onMounted,defineAsyncComponent} from 'vue'; const C = defineAsyncComponent(() => import('./C.vue') ) const message=ref('sblc') const sa原创 2022-07-01 15:16:27 · 291 阅读 · 1 评论 -
vue3 prop验证类型
String,Number,Boolean,Array,Object,Date,Function,Symbol,原创 2022-07-01 14:54:44 · 155 阅读 · 0 评论 -
vue3 nextTick
{{message}} change import {ref,nextTick} from 'vue' const message =ref('sblc') const sb = ref(null) const cha原创 2022-07-01 14:30:00 · 753 阅读 · 0 评论 -
vue3 异步组件
{{ tab.name }}原创 2022-07-01 13:36:54 · 2276 阅读 · 0 评论 -
vue3 动态组件
{{ tab.name }}原创 2022-07-01 13:24:51 · 3846 阅读 · 0 评论 -
vue3 定义一个空数组
import {reactive,onMounted} from 'vue' import axios from 'axios' let state =reactive({ books:[] }) onMounted(()=>{ axios({ method:'get', url: '/api/book/hot' }原创 2022-07-01 10:26:41 · 4568 阅读 · 0 评论 -
vue 引入公共css文件
1、在入口js文件main.js中引入,一些公共的样式文件,可以在这里引入。import Vue from 'vue'import App from './App' // 引入App这个组件import router from './router' /* 引入路由配置 */import axios from 'axios'import '../static/css/global.css' ......原创 2022-06-30 16:00:21 · 432 阅读 · 0 评论 -
vue3 mouse.js 鼠标的位置
mouse.jsimport { ref,onMounted,onUnmounted } from "vue"export function useMouseposition(){ const x=ref(0); const y=ref(0); function update(e){ x.value= e.pageX; y.value = e.pageY } onMounted(()=>{ window.addEvent原创 2022-06-30 15:16:41 · 275 阅读 · 0 评论 -
vue3 props 传值
子组件 {{name}} butTap1 butTap1 const emit = defineEmits(['butTap11', 'butTap21'])原创 2022-06-30 14:21:30 · 436 阅读 · 0 评论 -
vue3 solt
父组件 header sblc 子组件 header原创 2022-06-30 14:08:07 · 340 阅读 · 0 评论 -
小满Router(第十二章-动态路由)
小满Router(第十二章-动态路由)_小满zs的博客-CSDN博客原创 2022-06-09 10:38:31 · 332 阅读 · 0 评论 -
vue 3路由过渡动效
2 routes: [ { path: '/', component: () => import('@/views/Login.vue'), meta:{ title:"登录", transition:"animate__fadeInUp", } }, { path: '/index', component: () => import('@/views/Index.vue'),原创 2022-06-09 10:17:30 · 369 阅读 · 0 评论 -
vue 路由权限判断
const whileList = ['/'] router.beforeEach((to, from, next) => { let token = localStorage.getItem('token') //白名单 有值 或者登陆过存储了token信息可以跳转 否则就去登录页面 if (whileList.includes(to.path) || token) { next() } else { next({原创 2022-06-09 09:53:04 · 317 阅读 · 0 评论 -
element plus 里面组件,页面提示
tsconfig.json{ "compilerOptions": { // ... "types": ["element-plus/global"] }}原创 2022-06-08 14:38:35 · 284 阅读 · 0 评论 -
Vue3 + Vite + Ts 报错:Property ‘ ‘ does not exist on type ‘never‘
将 package.json 文件中的 "build": "vue-tsc --noEmit && vite build",改为 : "build": "vite build",原创 2022-06-09 09:52:09 · 1156 阅读 · 0 评论 -
前端下载文件,乱码处理and文件重命名
在请求接口中设置responseType:'blob',可以正常下载downloadAttachment({ courseId:item.courseId,//课程ID attachmentId:item.id//课程资料ID }).then((res)=>{ let blob = new Blob([res]);原创 2022-06-07 10:16:38 · 192 阅读 · 0 评论 -
vue3+vite插件配置系列2-unplugin-auto-import
1.beforenpm i -D unplugin-auto-importimport AutoImport from "unplugin-auto-import/vite"export default defineConfig({ plugins: [ ... AutoImport ({ imports: ["vue", "vue原创 2022-06-04 17:05:36 · 1295 阅读 · 0 评论 -
vue3 使用 lodash
防抖,节流原创 2022-06-04 15:25:04 · 5735 阅读 · 0 评论 -
macbook air vue3安装
vue3 mac 安装原创 2022-05-18 14:07:09 · 1037 阅读 · 0 评论 -
解决vue中使用swiper插件
模拟从后台取下数据,然后数据绑定在swiper标签中。[html] view plain copy<template> <div class="homePage"> <abc></abc> <div id="banner"> <div class转载 2018-05-02 14:17:42 · 1785 阅读 · 0 评论 -
vue mint-ui tabbar变组件使用
新建tabbar.vue<template> <mt-tabbar v-model="message" fixed> <mt-tab-item id="MainPage"> <img slot="icon" :src="this.atabs[0]">转载 2018-05-04 10:12:43 · 6278 阅读 · 0 评论 -
vue 获取当前时间 格式YYYY-MM-DD
/** * 获取当前时间 * 格式YYYY-MM-DD */Vue.prototype.getNowFormatDate = function() { var date = new Date(); var seperator1 = "-"; var year = date.getFullYear(); var month = date.getMonth() + 1; var strDat...转载 2018-05-07 15:12:11 · 92501 阅读 · 0 评论 -
移动端项目中 @2x 图 和 @3x 图 的使用
移动端开发过程中,因为手机的dpr(设备像素比不同),我们需要根据dpr来修改图标的大小:1.通过mixin,动态修改图标的背景图片。通过@media (媒体查询),判断设备的dpr。123456@mixin bg-image($url) { background-image: url($url + "@2x.png"); @media (-webkit-min-device-pixe...转载 2018-05-07 15:15:20 · 15045 阅读 · 0 评论 -
实现 1像素border
实现 1像素border1234567891011121314border-1px($color) position: relative &:after display: block position: absolute left: 0 bottom: 0 width: 100% border-top: 1px solid $color con...转载 2018-05-07 15:15:44 · 508 阅读 · 0 评论 -
vue中引用阿里字体图标的方法
解决办法1.引入css文件?1import 'font-awesome/css/font-awesome.min.css'2.在webpack.config中配置?1234{ test: /\.(eot|svg|ttf|woff|woff2)$/, loader: 'file-loader'}总结转载 2018-05-09 10:25:55 · 837 阅读 · 0 评论 -
Vue面试题
一. 请谈谈Vue中的MVVM模式MVVM全称是Model-View-ViewModelVue是以数据为驱动的,Vue自身将DOM和数据进行绑定,一旦创建绑定,DOM和数据将保持同步,每当数据发生变化,DOM会跟着变化。 ViewModel是Vue的核心,它是Vue的一个实例。Vue实例时作用域某个HTML元素上的这个HTML元素可以是body,也可以是某个id所指代的元素。DOMListene...转载 2018-05-14 10:52:12 · 497 阅读 · 0 评论 -
vue生命周期面试题
1、什么是vue生命周期?答: Vue 实例从创建到销毁的过程,就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程,我们称这是 Vue 的生命周期。2、vue生命周期的作用是什么?答:它的生命周期中有多个事件钩子,让我们在控制整个Vue实例的过程时更容易形成好的逻辑。3、vue生命周期总共有几个阶段?答:它可以总共分为8个阶段:创建前/后, 载入前...转载 2018-05-14 10:34:19 · 526 阅读 · 0 评论 -
一个项目学会前端实现登录拦截
时间:2018-01-13 12:29来源:未知 作者:admin一个项目学会vue全家桶+axios实现登录、拦截、登出功能,以及利用axios的http拦截器拦截请求和响应。 前言 该项目是利用了Github 提供的personal token作为登录token,通过token访问你的Reposi一个项目学会vue全家桶+axios实现登录、拦截、登出功能,以及利用axios的http拦截器拦...转载 2018-05-14 11:00:16 · 893 阅读 · 0 评论 -
vue2.X props 数据传递 实现组件内数据与组件外的数据的双向绑定
vue2.0 禁止 子组件修改父组件数据在Vue2中组件的props的数据流动改为了只能单向流动,即只能由组件外(调用组件方)通过组件的DOM属性attribute传递props给组件内,组件内只能被动接收组件外传递过来的数据,并且在组件内,不能修改由外层传来的props数据。 在Vue2.0中,实现组件属性的双向绑定方式1. 在组件内的data对象中创建一个props属性的副本 因为result...转载 2018-05-07 15:15:59 · 532 阅读 · 0 评论 -
vue2.X slot 分发内容
1.概述:简单来说,假如父组件需要在子组件内放一些DOM,那么这些DOM是显示、不显示、在哪个地方显示、如何显示,就是slot分发负责的活。 2.默认情况下父组件在子组件内套的内容,是不显示的。代码: 效果图: 显示内容是一个button按钮,不包含span标签里面的内容; 3.单个slot简单来说,只使用这个标签的话,可以将父组件放在子组件的内容,放到想让他显示的地方。代码:例如这样写的话,结...转载 2018-05-07 15:16:10 · 526 阅读 · 0 评论 -
vue2.X 组件通信($emit $on props)
1.index.html 子组件直接修改父组件的数据组件通讯: vm.$emit(); vm.$on();父组件和子组件:子组件想要拿到父组件数据: 通过 props 之前,子组件可以更改父组件信息,可以是同步 sync 现在,不允许直接给父级的数据,做赋值操作123456789101112131415161718192021222324252627282930313233343536...转载 2018-05-15 10:04:45 · 560 阅读 · 0 评论