前端
woflyoycm
这个作者很懒,什么都没留下…
展开
-
vue3项目应用font awesome6
element-plus框架的图标icon种类较少,一般无法涵盖所有业务情况这时候引入font awesome6免费版,图标库非常丰富,一般可以满足所有业务场景官网:Font Awesome 6,一套始终绝佳的图标字体库和CSS框架。Font Awesome6中文网。官网上有vue3的引入教程这里复制主要部分。原创 2023-09-11 17:50:24 · 589 阅读 · 0 评论 -
Vue3 echarts v-show无法重新渲染的问题
nextTick方法之后(Dom重新渲染)再去调用echarts图标的生成方法即可。这里需要引入nextTick方法。部分html代码如下。原创 2023-09-11 12:39:23 · 573 阅读 · 0 评论 -
vue3项目使用signalr(长链接/服务端推送到客户端)
vue3 signalr 长链接 服务端推送消息到客户端原创 2023-01-31 16:15:05 · 4928 阅读 · 0 评论 -
简单使用vue拖拽组件vue3-dnd
vue3-dnd vue3项目拖拽元素以及保存拖拽位置原创 2023-01-30 14:56:18 · 3955 阅读 · 0 评论 -
vue axios提交时间少8小时(少1天)
vue axios提交时间和element日期选择框时间不一致原创 2023-01-30 11:53:56 · 951 阅读 · 0 评论 -
vue3简单使用打印插件vue-plugin-hiprint
打印 vue3 vue-plugin-hiprint原创 2023-01-17 18:19:29 · 4292 阅读 · 0 评论 -
阮一峰Flex布局
Flex 布局教程:语法篇 - 阮一峰的网络日志转载 2022-04-08 16:36:02 · 270 阅读 · 0 评论 -
Angularjs防双击
app.config(function ($provide) { $provide.decorator('ngClickDirective', ['$delegate', '$timeout', function ($delegate, $timeout) { //记得在config里注入$provide var original = $delegate[0].compile; var delay = 500;//设置间隔时间 $delegate[0].compile = funct.原创 2021-10-25 15:05:49 · 147 阅读 · 0 评论 -
js 下载图片文件
直接用window.location.href = file.Url是无法下载图片文件的,chrome默认会打开一个新的tab并展示大图,直接下载图片文件的方法如下var downloadIamge = (imgsrc, name) => { //下载图片地址和图片名 var image = new Image(); // 解决跨域 Canvas 污染问题 image.setAttribute('crossOrigin', 'anony转载 2021-03-25 10:52:17 · 570 阅读 · 0 评论 -
angularjs过滤器filter
过滤器可以直接定义在全局使用示例代码://定义一个叫myFilter的过滤器//input是被过滤的数组/对象等module.filter('myFilter',function(){ return function(input,keyword){ return input.filter(x=>{ return x.isEnabled && x.Name.indexOf(keyword)>=0 }) }})module.controller('MyC原创 2021-03-25 09:35:17 · 294 阅读 · 0 评论 -
vue.config.js备份一个
const webpack = require("webpack");module.exports = { //打包要放在根目录的mobile文件夹下面 所以加入publicPath配置 publicPath: process.env.NODE_ENV === 'production' ? '/mobile/' : '/', configureWebpack: { //֧��jquery plugins: [ .原创 2021-02-26 14:55:19 · 167 阅读 · 0 评论 -
理解 JavaScript 的 async/await
https://segmentfault.com/a/1190000007535316转载 2021-02-06 11:53:17 · 69 阅读 · 0 评论 -
vue3 组合式api
vue2中 经常使用的属性:data methods mounted 分别用来存双向绑定的数据、方法,挂载完成之后要执行的方法vue3不再推荐这种写法!!为了把同一个功能点的内容,从data、methods中抽离出来放到一起,甚至复用业务逻辑,vue3使用了setup()方法,每个业务逻辑自己定义好绑定的数据和方法,然后在setup方法中统一调用,setup方法相当于是vue的api入口setup方法只执行1次! 解析props之后会调用setup方法,这时候尚未创建组件实例,所以是不能通过原创 2021-02-04 11:16:02 · 508 阅读 · 0 评论 -
vue3 组件学习笔记
props属性props的命名也可以和component一样使用小写单词+-直接通过对象传递父组件可以通过v-bind指令,直接将对象传递到子组件,传递的对象和子组件暴露的props名称必须一致!父组件<child-component v-bind="paramObj"></child-component>//...data(){ return{ paramObj:{ id:1, name:'testPropName' } }}上面的写法等原创 2021-02-03 14:26:00 · 108 阅读 · 0 评论 -
vue3项目创建(jquery bootstrap) vs2019
开发环境 vs20191、vs2019加上node.js开发环境2、vs2019创建JavaScript类型的vue项目3、删除项目文件夹中的js、配置、文件夹4、新建一个文件夹,我们使用vue cli4来新建项目5、vue create myProject 选择vue3 并加入vuex vue-router 这样vuecli创建项目之后会自动引入这两个依赖6、vue add axios 用vuecli引入axios依赖(管理http请求)7、安装npm install j...原创 2021-02-03 12:19:34 · 561 阅读 · 0 评论 -
vue3学习笔记 vue基础
//创建Vue应用const app=Vue.createApp({})//创建MyInput组件,注册到appapp.component('MyInput',MyInput)//挂载Vue应用到<div id=‘mydiv’></div> vm是组件实例const vm=app.mount('#myDiv')//也可以通过链式调用app.component('MySelect',MySelect).directive('focus',FocusDirective)原创 2021-02-03 00:43:14 · 194 阅读 · 0 评论 -
前端地区选择器
https://fengyuanchen.github.io/distpicker/原创 2021-01-20 15:45:32 · 2317 阅读 · 0 评论 -
Angularjs 监听页面路径变化locationChange
开始跳转$locationChangeStart$rootScope.$on('$locationChangeStart', locationChangeStart);function locationChangeStart(event,toUrl,fromUrl){event.preventDefault();//阻止默认事件(默认跳转)console.log(fromUrl);console.log(toUrl);}用上面的方法监控路由更改!使用场景举例:例如根据登录用户的权限,来原创 2021-01-20 13:36:36 · 891 阅读 · 0 评论 -
本地前端Vue项目npm run dev正常 npm run build失败 报错unexpected token ? in JSON at position 0
1 尝试删除package-lock.json后重新build 还是失败2 尝试npm cache clear --force 然后重新build 还是失败3 删除node_modules文件夹重新cnpm install 然后重新build 成功失败时内容如下:原创 2020-11-01 12:29:58 · 1515 阅读 · 0 评论 -
WebSocket 前端 Vue 长连接 断线重连
文章目录WebSocket简介额外注意点实际开发代码创建WebSocket工具文件创建WebSocket连接初始化WebSocket心跳防止断开连接收到信息后区分业务信息和心跳信息定义关闭连接的方法,方便登出时使用将关闭和创建连接的方法在main中注册全局,方便业务代码中使用chrome调试webpack和nginx中的代理设置webpack配置websocket代理nginx配置websocke...原创 2019-07-12 00:36:09 · 9097 阅读 · 6 评论 -
Vue移动端框架的选择
文章目录Vue移动端前端框架的选择Vue移动端前端框架的选择vue后台项目web端一般都选用ElementUI,但是移动端的选择还是比较多的。这里公司由于有少量的移动端页面开发需求(表单类页面),所以查阅了一下当前用的较多的移动端Vue组件库由于ElementUI和mintUI都是饿了么团队的,所以一开始选择了mintUI。但是,但是minUI真是难用啊!!首先,mintUI的git...原创 2019-08-09 17:24:21 · 5555 阅读 · 0 评论 -
javascript布尔值的转换与条件判断
js中数据转Boolean类型是非常重要的一点,不弄懂js中的Boolean类型,容易在逻辑判断中出现问题,无论是vue里面的v-if还是js中的if判断,都会经常进行各种类型数据转Boolean转换规则js中0 ‘’(空字符串) null undefined NaN 都会转换成false,其他数据都会转化成true转换方法Boolean()这是显示转换的方法,这种方法实际用到...原创 2019-08-12 14:48:38 · 3132 阅读 · 1 评论 -
js数组的map方法和filter方法
文章目录Map方法方法定义与说明举例查看方法对代码的优化常见使用方式预先定义处理函数Filter方法Map方法方法定义与说明js中的map方法配合箭头函数,能够减少很多代码量,而且代码看起来也会更加清晰简洁(ie9+)map方法的主要作用是,根据原数组生成一个新的数组,并且不会修改原数组使用语法是array.map(function(currentValue, index, arr)...原创 2019-08-13 11:55:24 · 1596 阅读 · 0 评论 -
JS中的this指向
文章目录总体规则特殊情况Vue中的thissetTimeout总体规则js中的this指向谁?谁调用了函数,this就指向谁!this只能指向对象this指向取决于函数在哪儿调用,不取决于this写在哪儿this指向函数的调用者举例:通过函数名()直接调用,指向windowfunction func(){ console.log(this);}func();//wind...原创 2019-09-26 17:32:12 · 107 阅读 · 0 评论 -
执行环境 let const var
文章目录执行环境作用域链块级作用域执行环境变量和函数有权访问的其他数据每个执行环境都有一个变量对象环境中定义的所有变量和函数都保存在这个对象中全局执行环境是最外围的执行环境,被认为是window对象,所有全局变量和函数都是作为window对象的属性和方法创建的。某个执行环境的所有代码执行完毕后,该环境被销毁,保存在其中的所有变量和函数定义也随之销毁。每个函数都有自己的执行环境。当执...原创 2019-09-27 15:31:20 · 134 阅读 · 0 评论 -
ElementUI h5 移动端照片拍照 本地预览 旋转压缩 并上传
文章目录调用摄像头拍照本地预览旋转压缩上传功能需求是移动端扫描二维码之后,跳转到在线网页进行自拍,然后上传拍照结果。调用摄像头拍照在h5中,使用input type="file"的 capture="camera"这个属性就可以调用摄像头在这里我们使用的是ElementUI的组件,实际这个组件里面是包含一个input type="file"的元素的所以我们只需要修改这个元素的capt...原创 2019-07-11 20:52:50 · 2762 阅读 · 0 评论