熊宗的博客

单个条件：@keyup.enter.native="CurrentChange(1)"@submit.native.prevent多个条件：创建时监听：window.addEventListener('keydown',this.handleKeyDown,true);//开启键盘监听模式触发： handleKeyDown(e){ let key = null; if(window.event === undefined){ key = e.ke

Vue3 组件通信方式props$emitexpose / ref$attrsv-modelprovide / injectVuexmittVue3 通信使用写法:props用 props 传数据给子组件有两种方法，如下// Parent.vue 传送<child :msg2="msg2"></child><script setup> import child from "./child.vue" import { ref,

toFixed [MDN](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed)toFixed() 方法使用定点表示法来格式化一个数值。一、保留小数点后两位四舍五入export function NumFilter (value) { // 截取当前数据到小数点后两位 let realVal = parseFloat(value).toFixed(2)

自定义上传：uploadFile(file) { const param = new FormData() //提交formData let files= file.file param.append('files', files) uploadFile(param).then(response => { // 上传成功提示等 }).catch((err) => { let uid = files.uid let idx = t

Vue3.0快速上手

1.HTML <quill-editor ref="QuillEditor" v-model="form.context" :options="editorOption" @blur="onEditorBlur($event)" @focus="onEditorFocus($event)"

this.formatDate(this.form.effectiveTimeStart, 'yyyy-MM-dd hh:mm') formatDate(date, fmt = 'yyyy-MM-dd') { if (typeof (date) === 'number') { date = new Date(date) } var o = { "M+": date.getMonth() + 1, //月

<template> <view class="content"> <view class='home'> <swiper indicator-dots circular autoplay interval=3000 > <swiper-item v-for="(item,index) in swipers" :key="index"> <image :src="item"&gt

Vue PC端框架Element中文文档：http://element-cn.eleme.io/#/zh-CNgithub地址：https://github.com/ElemeFE/elementiView中文文档：https://www.iviewui.com/github地址：https://github.com/iview/iviewvue-element-admin中文文档：https://panjiachen.github.io/vue-element-admin-si

参考：https://uniapp.dcloud.io/component/page-meta?id=page-metamodule.exports = { css: { loaderOptions: { postcss: { plugins: [ require(‘postcss-px-to-viewport‘)({ unitToConv

方法一：el-input “type=number“ 隐藏上下箭头/deep/ input::-webkit-inner-spin-button { -webkit-appearance: none !important;}/deep/ input[type='number'] { -moz-appearance: textfield !important;}方法二：事件控制（兼容）1.只允许输入整数或小数只保留小数点后两位<el-input size="small" o

EasyPlayer.jsEasyPlayer.js H5播放器，是一款能够同时支持HTTP、RTMP、HTTP-FLV、HLS（m3u8）视频直播与视频点播等多种协议，支持H.264、H.265、AAC等多种音视频编码格式，支持mse、wasm等多种解码方式，支持Windows、Linux、Android、iOS全平台终端的H5播放器。Github：https://github.com/tsingsee/EasyPlayer.js文档：http://open.tsingsee.com/sdk/eas

一.第一步：首先在项目目录下安装阿里云视频插件npm install vue-aliplayer -S二.配置AliPlayer.vue路由三.在index.html里引入js四.Aliplayer详情如下代码参考地址：https://player.alicdn.com/aliplayer/tutorial/tutorial.html全局引入步骤：安装npm install vue-aliplayer -Syarn add vue-aliplayer -S使用import VueA

概念：函数防抖(debounce)：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。函数节流(throttle)：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。**函数节流（throttle）与 函数防抖（debounce）**都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。1、函数防抖(debounce)实现方式：每次触发事件时设置一个延迟调用方法，并且取消之前的延时调用方法缺

从 2.6.0 开始，可以用方括号括起来的 JavaScript 表达式作为一个指令的参数：<!--注意，参数表达式的写法存在一些约束，如之后的“对动态参数表达式的约束”章节所述。--><a v-bind:[attributeName]="url"> ... </a>这里的 attributeName 会被作为一个 JavaScript 表达式进行动态求值，求得的值将会作为最终的参数来使用。例如，如果你的 Vue 实例有一个 data property att

if(this.form.appointmentApplyList.find(item => item.isEdit)) return this.$message({ type: 'warning', message: '請先取消編輯行爲！' });this.form.appointmentApplyList.find()是指在list数组中找某样东西，item是find()函数的寻找某样...

1.vue-router路由版本更新产生的问题,导致路由跳转失败抛出该错误;真正的原因是由于返回了一个Promise对象, 正常的跳转由then方法执行 当正常的路由跳转, 被"路由导航守卫"拦截并重新指定路由时, 由于 this.$router.push() 返回的是Promise对象, 此时then方法不能正常执行, 无法跳转到指定路由, 就触发了该对象的捕获错误的方法, throw抛出错误, 但并不影响程序功能.处理：在router文件下的index.js中添加下面的代码。const orig

**框架与库之间最本质区别在于控制权：you call libs, frameworks call you（控制反转）**![在这里插入图片描述](https://img-blog.csdnimg.cn/8d5c07d3b32d4840ba5ca7af303a62a8.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM2NjQ4NTU1...

GitHub — 开发者最最最重要的网站：https://github.comStack Overflow — 解决 bug 的社区：https://stackoverflow.com/程序员客栈：https://www.proginn.com/掘金 — 帮助开发者成长的技术社区：https://juejin.imv2ex：https://www.v2ex.com/博客园：https://www.cnblogs.com/Medium：https://medium.com/https://ne.

一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、非常灵活的配置项、扩展接口等…https://github.com/xuliangzhan/vxe-tablehttps://gitee.com/xuliangzhan_admin/vxe-table功能:目前vxe-table已经来到4.x版本，以下是文档中所说明的功能，可以说是非常丰富了，基本上满足大多数复杂业务场景（比如说大

实现：HTML：< el-input v-model="olde" @focus=" focus($event)"></ el-input>JS:focus( event) { event.currentTarget. select();}注意：尝试过uniapp中小程序和APP不适用。

1.页面代码<div width="800px"> <button style="position: absolute;top: 15px;left: 15px;width: 75px;" onclick="flyToCar()">飞到小车</button> <button style="position: absolute;top: 45px;left: 15px;width: 75px;" onclick="flyToBack()">返&

  产品给用户使用后，想要感知项目的 PV（浏览次数）、UV（独立访客），可以使用第三方埋点，这里记录的是 Vue 项目（hash 路由）基于友盟的埋点方法，包含事件统计。一、PV、UV  新建一个/src/mixins/mixUmeng.js文件，内容如下：/* eslint-disable *//******************* 友盟埋点 *******************/const SITE_ID = 1234567890 // 替换成自己的站点ID

在入口App.vue中添加代码<script> import {webId} from '@/api/ajax'; export default { name: 'bodyMain', mounted() { const script = document.createElement('script') script.src = "https://s95.cnzz.com/z_stat.php?id="+

1.网站注册完成链接引入；2.引入插件：npm install vue-uweb --save；3.https://www.npmjs.com/package/vue-uweb

/** * 判断是否需要更新软件 */ isUpdate() { uni.request({ url: this.cxUrl + "versionInfo/getAppVersion", success: (res) => { var newVer = res.data.data.versionName; var wgtVer; plus.runtime.getProperty(plus.runtime.appid,

hrefLink() { var that =this //判断终端 var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //...

安装postcss-pxtoremnpm install postcss-pxtorem --save新建rem.js文件const baseSize = 32// 设置 rem 函数function setRem () { // 当前页面宽度相对于 750 宽的缩放比例，可根据自己需要修改。 const scale = document.documentElement.clientWidth / 750 // 设置页面根节点字体大小 document.d..

<template> <div> <button @click="send">发消息</button> </div></template><script>export default { data () { return { path:"ws://192.168.0.200:8005/qrCodePage/ID=1/refreshTim.

1.https://www.pexels.com2.https://pixabay.com3.https://unsplash.com4.https://www.hippopx.com5.http://streetwill.co6.http://www.polayoutu.com7.https://gratisography.com8.https://www.freestockimages.ru9.https://visualhunt.com10.https://magdeleine.co

一，flexible.js 的使用方式：github地址：https://github.com/amfe/lib-flexible官方文档地址：https://github.com/amfe/article/issues/17本文中有部分内容引至上面这个文档。（一），引用方式1，引用cdn地址 <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js" >

// rem等比适配配置文件// 基准大小const baseSize = 1let rem;// 设置 rem 函数function setRem () { // 当前页面宽度相对于 1920宽的缩放比例，可根据自己需要修改。 const scaleX = document.documentElement.clientWidth / 1920 const scaleY = document.documentElement.clientHeight / 1080 // 需要取缩放.

const path = require('path');//引入path模块function resolve(dir){ return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径}module.exports={ chainWebpack:(config)=>{ config.resolve.alias .set('@',resolve('./src')) .set('compone.

组件通信方式无外乎以下几种：Prop（常用） $emit(组件封装用的较多) .sync语法糖 （较少） $attrs和$listeners(组件封装用的较多) provide和inject（高阶组件/组件库用的较多） 其他方式通信（兄弟组件及全局变量等）...

1.colorUI官网链接：https://www.color-ui.com/2.在app.vue引入css: @import "colorui/main.css"; @import "colorui/icon.css";3.在main.js引入cu-custom组件import cuCustom from 'colorui/components/cu-custom.vue'Vue.component('cu-custom',cuCustom)4.在index页面使用colo.

EventBus 称为事件总线$emit(“事件名称”，“参数”)--------发送事件$on(“事件名称”，“接收参数”)-------接受事件EventBus可以是全局创建一个实例，在main.js中Vue.prototype.$eventBus = new Vue()方法一:1.main.js全局创建EventBusimport Vue from 'vue'import App from './App.vue'import router from './router'

main.js 中的 Vue.config.productionTip = false上面这行代码的意义，是阻止 vue 在启动时生成生产消息提示。如果没有这行代码，或者设置为true，控制台就会多出这么一段代码:You are running Vue in development mode.Make sure to turn on production mode when deploying for production.大概意思就是：您正在开发模式下运行Vue。在部署以进行生产时，请确.

const path = require('path');//引入path模块function resolve(dir){ return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径}module.exports={ chainWebpack:(config)=>{ config.resolve.alias .set('@',resolve('./src')) .set('compone.

安装使用npm：npm install dplayer --save使用纱线：yarn add dplayer＃快速开始首先，让我们初始化一个最简单的DPlayer加载DPlayer文件<div id="dplayer"></div><script src="DPlayer.min.js"></script>或与模块捆绑器一起使用：import DPlayer from 'dplayer';...