栏目: JavaScript

Vue3如何优雅的实现移动端登录注册模块

近期开发的移动端项目直接上了vue3,新特性compositionapi确实带来了全新的开发体验.开发者在使用这些特性时可以将高耦合的状态和方法放在一起统一管理,并能视具体情况将高度复用的逻辑代码单独封装起来,这对提升整体代码架构的健壮性很有帮助.如今新启动的每个移动端项目基本上都包含注册登录模块,...

2021-03-28 122 0 0 阅读全文

Vue项目使用$Router.Go(-1)返回时刷新原来的界面操作

在项目需求中,我们常常需要使用$router.go(-1)返回之前的页面,但是却发现,之前的界面,保持着上次跳转的状态,比如说:弹框未关闭之类的等等,。。。。。问题如下:界面1:界面2使用$router.go(-1)返回上一次的界面由于使用$router.go(-1)返回,导致之前的数据都保留,并未...

2021-05-27 175 0 0 阅读全文

Vue.Js之Mixins混合组件详解

混合以一种灵活的方式为组件提供分布复用功能。混合对象可以包含任意的组件选项。当组件使用了混合对象时,混合对象的所有选项将被“混入”组件自己的选项中。一、Mixins的基本用法现在有个数字点击递增的程序,假设已经完成了,这时我们希望每次数据变化时都能够在控制台打印出提示:“数据发生变化”.代码实现过程...

2021-09-14 91 0 0 阅读全文

如何管理Vue中的缓存页面

Vue中内置的组件可以帮助我们在开发SPA应用时,通过把全部路由页面进行缓存(当然也可以有针对性的缓存部分页面),显著提高页面二次访问速度,但是也给我们在某些场景带来了困扰,其中包含两个主要矛盾:缓存页面如何在合适的时机被销毁(keep-alive组件提供了三个参数来动态配置缓存状态,但是作用有限,...

2021-03-28 150 0 0 阅读全文

基于Vue和Bootstrap实现简单的留言板功能

作为一个刚开始接触vue的前端小白,我想在这里记录一些学习过程,希望和大家一起进步,如有不妥处之处,请多多指教呦。今天呢,是我学习vue的第二天,我想制作一个简易的留言板。功能很简单,就是数据的增删改查,下面开始步入正题:大致布局如下:1.html布局如果大家不想自己去写css样式,使用bootst...

2021-07-01 156 0 0 阅读全文

Vue生命周期Activated之返回上一页不重新请求数据操作

activated:英文原意:使活动、触发在Vue的生命周期函数中,这个好像用的不是特别多?(也许只是在我的工作中这个用的不多,或者说叫几乎不用这个)一、需求前不久在项目中有这样一个需求:在订单页面的地址信息栏,默认通过接口填充了一个已经设置过的一个的默认地址,现在要跳转去地址列表重新选择一个地址并...

2021-05-27 163 0 0 阅读全文

ES6中的类(Class)示例详解

类的基本语法ES6提供了更接近面向对象(注意:javascript本质上是基于对象的语言)语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让对象原...

2021-04-10 149 0 0 阅读全文

Vue项目实现分页效果

vue项目中实现分页效果,供大家参考,具体内容如下1.这里我们使用element-ui来实现,先使用npm安装npmielement-ui-S2.在main.js中全局引入importElementUIfrom"element-ui"import'element-ui/lib/t...

2021-03-18 197 0 0 阅读全文

JS中锚点链接点击平滑滚动并自由调整到顶部位置

锚点链接点击平滑滚动并自由调整到顶部的位置一、添加锚点注意a标签用的nacTo而不是href;目标选择目标客户广告形式广告投放预算和时间安排转化追踪二、给右侧需要滚动的内容添加对应的id您的目标是:品牌参与度更改我希望人们了解我的业务。广告将显示给最右可能浏览您的广告的人群。第二部分内容第三部分内容...

2021-03-28 166 0 0 阅读全文

Vue中Watch、Computed、Updated三者的区别及用法

1、watch理解:监听器,监听某个数据的变化从而来执行一些操作,当data里面的数据发生变化的时候来执行一下开销较大或异步的操作1、监听值类型(简单类型)数据//在一个vue实例中newVue({el:"#myApp",data:{num1:1,num2:2},methods:...

2021-05-27 189 0 0 阅读全文

JQuery鼠标滑动切换图片实现手风琴效果

jQuery鼠标滑动切换图片手风琴手风琴.bigbox{width:610px;height:270px;border:1pxsolid#ccc;margin:0auto;}ul{margin:0;padding:0;float:left;height:270px;}li{float:left;li...

2021-07-01 206 0 0 阅读全文

Vue实现倒计时功能

本文实例为大家分享了vue实现倒计时功能的具体代码,供大家参考,具体内容如下通过父组件传入的结束时间减去当前日期得到剩余时间1.子组件部分倒计时{{day}}天{{hour}}时{{minute}}分{{second}}秒data(){return{day:"",//天hour:...

2021-03-18 105 0 0 阅读全文

详解在Vue-Cli3.0中自定Css、Js和图片的打包路径

我们有时候因为一些特殊需求,可能需要将js/css/img等资源文件都打包到根路径下,但vue-cli3.0的路径配置中仅有assetsDir配置项能够配置所有的静态文件所在的文件夹,并不能针对css/js/img等资源文件分别来做设置,那么请看我如何尝试的吧!分析众所周知,vue-cli3.0使用...

2021-04-26 175 0 0 阅读全文

Element Notification通知的实现示例

组件-Element—Notification(通知)组件—通知基本用法可自动关闭不会自动关闭exportdefault{methods:{open1(){consth=this.$createElement;this.$notify({title:'标题名称',message:h('i',{sty...

2021-05-27 157 0 0 阅读全文

Vue.Js实现图书管理功能

本文实例为大家分享了vue.js实现图书管理功能的具体代码,供大家参考,具体内容如下Document序号:{{book.id}}书名:{{book.name}}作者:{{book.author}}价格:{{book.price}}删除添加书籍书名作者价格添加varvm=newVue({el:'#ap...

2021-04-28 197 0 0 阅读全文

JS什么场景不适合箭头函数

概述这些年来,ES6将js的可用性提升到一个新的水平时:箭头函数、类等等,这些都很棒。箭头函数是最有价值的新功能之一,有很多好文章描述了它的上下文透明性和简短的语法。但每个事务都有两面。通常,新特性会带来一些混乱,其中之一就是箭头函数被误导了。本文将介绍一些场景,在这些场景中,你应该绕过箭头函数,转...

2021-04-29 161 0 0 阅读全文

Vue.Js 带下拉选项的输入框(Textbox With Dropdown)组件

带下拉选项的输入框(TextboxwithDropdown)是既允许用户从下拉列表中选择输入又允许用户自由键入输入值。这算是比较常见的一种UI元素,可以为用户提供候选项节省操作时间,也可以给可能存在的少数情况提供适配的可能。本来想着这个组件比较常见应该已经有比较多现成的例子可以直接应用,但是搜索了一...

2021-04-17 158 0 0 阅读全文

Jquery轻量级数字动画插件CountUp.Js使用详解

CountUp.js是一个无依赖,轻量级的JavaScript“类”,可用于快速创建以更有趣的方式显示数字数据的动画。该JS插件下载地址展示效果:详细代码示例:jquery轻量级数字动画插件varoptions={useEasing:true,//使用缓和useGrouping:true,//使用分...

2021-04-30 187 0 0 阅读全文

Js实现水平和竖直滑动条

最近在做练手项目时候,需要用到滑动条,所以就稍微研究了一下。首先来看水平滑动条,效果图如下:代码如下:水平滑动条*{margin:0;padding:0;}.scroll{margin:100px;width:500px;height:5px;background:#ccc;position:rel...

2021-08-11 183 0 0 阅读全文

Js实现弹框效果

本文实例为大家分享了js实现弹框效果的具体代码,供大家参考,具体内容如下js实现弹窗效果利用display来控制弹窗的现实和隐藏Xjs://点击关闭按钮varclose=document.querySelector(".close")close.onclick=function(...

2021-03-18 193 0 0 阅读全文