前言本文直接参考vue2.0官方文档， 并演示博主项目中的使用自定义指令 directive除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。注意，在 Vue2.0 中，代码复用和抽象的主要形式是组件。然而，有的情况下，你仍然需要对普通 DOM 元素进行底层操作，这时候就会用到自定义指令。举个聚焦输入框的例子：当页面加载时，该元素将获得焦点 (注意：a
转载
2024-04-29 20:15:10
322阅读
在网页的表单中，经常需要用程序来控制input和textarea的自动聚焦行为。例如我最近做的一个项目，有个装箱出库的流程，input框自动聚焦的流程如下：页面进入时自动聚焦到订单号输入框->订单号扫描完毕聚焦到商品条码输入框->扫描完一个商品条码后依然停留在条码输入框->所有条码扫描完毕聚焦到订单号输入框。为了应付这种需求，就做了这个指令，github地址：vue-auto-f
转载
2024-06-26 23:36:50
64阅读
自定义指令1.效果实现定义全局指令:v-focus ==> document.getElementById(‘search’).focus()// 定义全局的指令 v-focus
Vue.directive("focus",{
bind:function(el){
},
inserted:function(el){
el.focus()
}
转载
2024-10-21 13:42:37
52阅读
1.表单提交的方式（引入） ***通过type=“submit” ***通过type="button" οnclick=""来实现 ***通过超链接来实现&
转载
2023-12-13 08:16:57
84阅读
css中：focus伪类的使用，即给已获取焦点的元素设置样式 示例一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>:focus</title> <style> *{ margin: 0; padding:
转载
2020-10-19 17:15:00
518阅读
2评论
html页面中，诸如按钮、文本框等可视元素都具有拥有和失去焦点的事件，本文以文本框获得和失去焦点为例简单讲解onfocus和onblur的应用html页面中，诸如按钮、文本框等可视元素都具有拥有和失去焦点的事件，这些事件在响应鼠标或键盘动作时都可激发预设的操作。本文以文本框获得和失去焦点为例简单讲解onfocus和onblur的应用。一. onfocus（获得焦点事件）当一个文本框获得焦点时，它里
转载
2023-07-27 21:14:12
169阅读
# 项目方案：使用 jQuery 和 Vue.js 实现动态网页
## 1. 项目背景和目标
随着互联网的快速发展，动态网页的需求越来越大。本项目旨在利用 jQuery 和 Vue.js 技术，实现一个动态网页，提供用户友好的交互体验。具体目标如下：
- 使用 jQuery 实现页面的动态效果，例如动画、滚动等；
- 使用 Vue.js 实现数据的双向绑定，提高用户交互的流畅度；
- 通过合理
原创
2024-01-18 05:04:23
67阅读
Vue 中如何使用 SweetAlert官方说明：https://github.com/avil13/vue-sweetalert2#vue-2一、在 package.json 添
原创
2022-06-30 11:14:14
127阅读
安装mockjs npm install mockjs 可以使用数据模板生成模拟数据。 Mock.mock( rurl?, rtype?, template ) ) // 或者 Mock.mock( rurl, rtype, function( options ) ) Mock.mock( rurl ...
转载
2021-09-06 14:27:00
163阅读
2评论
1.在package.json里的dependencies加入"jquery" : "^3.2.1"2.在终端里输入npm install jquery --save-dev 3.找到build文件夹下的webpack.bas
原创
2024-05-06 10:20:01
24阅读
在现代前端开发中，Vue.js 是一个流行的 JavaScript 框架，而 Yarn 是一个快速、可靠和安全的依赖管理工具。在使用 Vue.js 项目时，如何有效地利用 Yarn 进行包管理是一个常见的问题。
## 问题背景
在开发 Vue.js 应用时，常常需要使用不同的库和依赖，这时 Yarn 提供了一个快速而有效的包管理方式。Yarn 的出现旨在解决 npm 的一些缺点，提供更好的性能
focus 改成 click 加 stop 加 native。<input @click.stop.native="stopstop">
原创
2023-03-15 09:42:01
697阅读
最近vue用的越来越勤了，在复习一下vue如何使用less和scss，直接进入主题吧：安装使用less： 1、首先使用npm下载依赖； npm i less less-loader -S 2、修改webpack.base.config.js文件，配置loader加载依赖，让其支持外部的less,在原来的代码上添加 // 此种方法在控制台中标签样式显示的是style标签样式
{
test:
转载
2024-02-24 00:21:57
593阅读
jQuery事件相关一. jQuery事件绑定jQuery中有两种绑定事件的方式eventName(fn)方法: 直接通过事件名来绑定$('button').click(function(){
alert('点击第一次')
})优点: 编码效率高缺点: 部分事件不能添加，因为jQuery没有实现on(eventName, fn)方法: 通过on()方法来绑定$('button').on('cli
转载
2023-11-01 15:19:13
59阅读
公司内部一直有大屏的需求，也一直再做，中途也踩了一些坑，但是没有认真的来总结下。首先项目中，做过移动端的适配，也有现在的大屏需求，中间都离不开不一个单位rem，自适应看起来就很麻烦，不过无惧困难，困难才会看到你说，哟，厉害了，我闪~，下面慢慢聊来。浅析rem首先rem是css单位，相比于px固定的像素单位，rem更加的灵活，还有现在也比较好的vm。如果从未了解过，可以先过过眼rem自适应。CSS3
转载
2024-07-11 21:25:58
237阅读
目录input事件示例input框的几种类型示例input事件click 点击事件，一般不会用于input输入框，会用于按钮，用于输入框就有点像focus了，当点击输入框时会触发
blur 失去焦点事件，当失去焦点时会触发。
focus 获取焦点事件，当获得焦点时会触发。
input 在输入框中每输入一个字符都会触发一次
change 当输入框内容改变了，且
转载
2023-06-07 22:02:08
662阅读
在Vue项目中使用Jsonp和Axios进行数据请求是一个常见的需求。Jsonp是一种跨域请求技术，而Axios是一个基于Promise的HTTP库。这两种方法结合起来可以实现更加灵活和强大的数据请求功能。
首先，我们需要安装Axios和Jsonp库：
```bash
npm install axios jsonp
```
然后，在Vue组件中引入这两个库：
```javascript
i
原创
2024-06-21 03:25:52
246阅读
使用前端路由，当切换到新路由时，想要页面滚到顶部，或者是保持原先的滚动位置，就像重新加载页面那样。 vue-router 能做到，而且更好，它让你可以自定义路由切换时页面如何滚动。注意: 这个功能只在 HTML5 history 模式下可用。当创建一个 Router 实例，你可以提供一个 scrollBehavior 方法：const router = ne
CompositionAPI 中如何使用 VueX
原创
2022-11-22 09:07:58
144阅读
哈喽，各位小伙伴，欢迎来到我是wangfang呀的博客！我是我是wangfang呀，虽然还在编程的“菜鸟”阶段，但我已经迫不及待地想和大家分享我一路上踩过的坑和学到的小技巧。如果你也曾为bug头疼，那么你来对地方了！今天的内容希望能够给大家带来一些灵感和帮助。
概述：混入的概念与应用
在 Vue 中，混入（Mixins） 是一种非常强大的功能，用于代码的复用。通过混入，我们可以将多个组件之间共
