JavaScript - 教程之家

88浏览

0评论

vue写h5页面的方法总结

下面就是小编带给大家的如何用vue写h5页面方法操作，希望能够给你们带来一定的帮助，谢谢大家的观看。1、当拿到设计师给的UI设计图，前端的首要任务就是布局和样式，相信这对于大部...

2020-05-27

103浏览

0评论

Vue中多个元素、组件的过渡及列表过渡的方法示例

多个元素之间过渡动画效果
多元素之间如何实现过渡动画效果呢？看下面代码.fade-enter,.fade-leave-to{ opacity: 0;}.fade-enter-active,.fade-leave-active{ transition:...

2020-05-27

57浏览

0评论

jquery无缝图片轮播组件封装

图片轮播在我们的前端开发中是非常常见的，下面是自己写的一个图片轮播组件，支持自动轮播，手动轮播，无缝衔接。dom结构
首先是dom结构，将所有内容放入一个大盒子，应用ul标签存放图...

2020-05-27

77浏览

0评论

vuex实现的简单购物车功能示例

本文实例讲述了vuex实现的简单购物车功能。分享给大家供大家参考，具体如下：购物车组件<template> <div> <h1>vuex-shopCart</h1> <div class="shop-listbox"> <sh...

2020-05-27

85浏览

0评论

Jquery实现无缝向上循环滚动列表的特效

效果呈现整个列表间隔设定的时间向上移动一个item的高度html结构： <div class="slide-title"> <span>title1</span> <span>title2</span> <span>title3</span> </div> <di...

2020-05-27

146浏览

0评论

vue实现购物车抛物线小球动画效果的方法详解

本文实例讲述了vue实现购物车抛物线小球动画效果的方法。分享给大家供大家参考，具体如下：先上最终效果图，在商品页面和商品详情页面点击加号添加商品时都可以看到小球抛物线落...

2020-05-27

81浏览

0评论

node.js微信小程序配置消息推送的实现

在开发微信小程序时，有一个消息推送，它的解释是这样的。消息推送具体的内容是下面的这个网址 https://developers.weixin.qq.com/miniprogram/dev/framework/server-ability...

2020-05-27

110浏览

0评论

JavaScript中.min.js和.js文件的区别讲解

Q&AQ: .js和.min.js文件分别是什么？A: .js是JavaScript 源码文件， .min.js是压缩版的js文件。Q：为什么要压缩为.min.js文件？减小体积 .min.js文件经过压缩，相对编译前的js文件...

2020-05-27

110浏览

0评论

Vue中JS动画与Velocity.js的结合使用

前面学习了用css实现动画效果，那 Vue 中能不能用js实现动画效果呢？其实 Vue 提供了很多动画钩子enter
入场动画钩子函数有before-enter、enter、after-enterbefore-enter
动画...

2020-05-27

74浏览

0评论

Vue中CSS动画原理的实现

下面这段代码，是点击按钮实现hello world显示与隐藏<div id="root"> <div v-if="show">hello world</div> <button @click="handleClick">按钮</button></div>let vm = new...

2020-05-27

195浏览

0评论

JavaScript实现的拼图算法分析

本文实例分析了JavaScript实现的拼图算法。分享给大家供大家参考，具体如下：学了html5的拖拽事件，相信做出一款小小的拼图游戏也不难吧。就来说一下怎么用drag事件完成拼图游戏...

2020-05-27

86浏览

0评论

JS+canvas画布实现炫酷的旋转星空效果示例

本文实例讲述了JS+canvas画布实现炫酷的旋转星空效果。分享给大家供大家参考，具体如下：canvas是html5的新标签，其画布功能尤为强大。当然了canvas在IE10以下浏览器是不兼容的，所...

2020-05-27

108浏览

0评论

vue实现点击隐藏与显示实例分享

如何使用vue进行按钮点击后指定区域内容隐藏，再次点击按钮隐藏内容显示。实现思路：首选需要设置一个属性为true(show:true)，然后使用v-if把show属性绑定到要显示与内容的标签身...

2020-05-27

77浏览

0评论

vue2.0+vue-router构建一个简单的列表页的示例代码

一：环境搭建使用vue-cli脚手架工具构建安装 vue-clinpm install -g vue-cli使用vue-cli初始化项目vue init demo1进到目录cd demo1安装依赖npm install开始运行npm run dev...

2020-05-27

58浏览

0评论

快速了解Node中的Stream流是什么

StreamBuffer 的工作原理 Data 是一块大数据他被分为很多个小数据每块小数据都被存储在内存中的 Buffer 中接着 Buffer 不断接收小数据同时一旦 Buffer 接收的小数...

2020-05-27

110浏览

0评论

JavaScript"模拟事件"的注意要点详解

DOM中的事件模拟三个步骤：首先通过document.createEvent()方法创建event对象，接收一个参数，即表示要创建的事件类型的字符串： UIEvents（DOM3中的UIEvent）鼠标和键盘事件； MouseEv...

2020-05-27

83浏览

0评论

extract-text-webpack-plugin用法详解

一背景
最近在做一个项目，项目本身是用vue-cli创建的单页面应用，由于项目扩展需要创建多页面，所以需要对不同的html分别进行css文件打包。于是开始研究extract-text-webpack-p...

2020-05-27

94浏览

0评论

VuePress 静态网站生成方法步骤

使用技术：VuePress - Vue 驱动的静态网站生成器
仓库地址：https://github.com/yinian-R/vuepress-demo
全局安装
## 安装yarn global add vuepress # 或者：npm install -g vue...

2020-05-27

106浏览

0评论

Node.js如何对SQLite的async/await封装详解

前言本文主要给大家介绍的是关于Node.js对SQLite的async/await封装的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍吧用于将每个SQLite函数同步化，并可...

2020-05-27

122浏览

0评论

使用vuepress搭建静态博客的示例代码

什么是vuePress
vuePress是以vue驱动的主题系统的简约静态网站生成工具（拥有自己的默认主题）。veuPress由vue,vue-router,webpack驱动的单页面应用，每个markdonw文件都使用mark...

2020-05-27

93浏览

0评论

VuePress 快速踩坑小结

最近有个开源项目非常火，那就是尤小右开发的 VuePress，VuePress 可以让您非常方便的在 Markdown 文档中编写 Vue 代码，并且 VuePress 对编译后的 HTML 文件做了一些针对搜索引...

2020-05-27

81浏览

0评论

JavaScript类型相关的常用操作总结

js的基本数据类型有哪些？
ECMAScript中有5中简单数据类型（也称为基本数据类型）: Undefined、Null、Boolean、Number和String。还有1中复杂的数据类型————Object，Object本质...

2020-05-27

96浏览

0评论

如何使用VuePress搭建一个类型element ui文档

网站成果样式项目书写步骤github地址:https://github.com/xuhuihui/dataCom官网：http://caibaojian.com/vuepress/guide/getting-started.html参考文章：https://www.freexyz.cn/...

2020-05-27

96浏览

0评论

微信小程序实现banner图轮播效果

本文实例为大家分享了微信小程序实现banner图轮播的具体代码，供大家参考，具体内容如下效果图：indicator-active-color="#007aff"//修改选中图片圆点的颜色js:const app = getAp...

2020-05-27

89浏览

0评论

vue中各种通信传值方式总结

1、路由通信传值路由通信是通过路由跳转用query把参数带过去，也是vue常用的通信手段。例子：创建并在路由注册一个组件Head<template> <div id="head"> <button @click="handl...

2020-05-27

75浏览

0评论

详解JavaScript原生封装ajax请求和Jquery中的ajax请求

前言：ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web 服务器交换数据，即在不需要刷新页面的情况下，就可以产生局部刷新的效果。Ajax 在浏览器与 Web 服务器之间使用...

2020-05-27

62浏览

0评论

手挽手带你学React之React-router4.x的使用

手挽手带你学React入门三档,带你学会使用Reacr-router4.x,开始创建属于你的React项目什么是React-router
React Router 是一个基于 React 之上的强大路由库，它可以让你向应用...

2020-05-27

75浏览

0评论

微信小程序实现简单表格

本文实例为大家分享了微信小程序实现简单表格的具体代码，供大家参考，具体内容如下效果图：wxml<view class="table"> <view class="tr bg-w"> <view class="th">SPB</view> <v...

2020-05-27

102浏览

0评论

手把手带你封装一个vue component第三方库

为什么选择自己封装第三方库最近几个月我司把之前两三年的所有业务都用了 vue 重构了一遍，前台使用 vue+ssr，后台使用了 vue+element，在此过程中封装和自己写了很多 vue compon...

2020-05-27

96浏览

0评论

微信小程序制作表格的方法

本文实例为大家分享了微信小程序制作表格的具体代码。微信小程序中没有专门的表格制作工具，不过使用列表渲染可以实现，下面是我做的表格图片：方法如下：在XXX.wxml中填写下面的代...

2020-05-27

89浏览

0评论

微信小程序实现简易table表格

本文实例为大家分享了微信小程序实现简易表格的具体代码，供大家参考，具体内容如下由于需要开发小程序，前端又是自己弄，类似table的标签也没有，后来看到小程序文档中推荐使用flex...

2020-05-27

121浏览

0评论

React通过redux-persist持久化数据存储的方法示例

在React项目中，我们经常会通过redux以及react-redux来存储和管理全局数据。但是通过redux存储全局数据时，会有这么一个问题，如果用户刷新了网页，那么我们通过redux存储的全局数...

2020-05-27

104浏览

0评论

一秒学会微信小程序制作table表格

大家都知道微信小程序自身没有提供表格这个组件，但是今天的项目需求又出现了，所以只能模仿一个了。效果图：代码挺简单方便的：wxml: <view class='history-table-wrap'> <view c...

2020-05-27

102浏览

0评论

微信小程序实现单选选项卡切换效果

这里展示一个工作中用到的微信小程序的单选选项卡切换效果的制作方法，供大家参考，具体内容如下效果如图：wxml:<view class="item" wx:for="{{data}}" wx:for-item="item" wx:fo...

2020-05-27

78浏览

0评论

webpack-url-loader 解决项目中图片打包路径问题

刚开始用webpack的同学很容易掉进图片打包这个坑里，比如打包出来的图片地址不对或者有的图片并不能打包进我们的目标文件夹里。
下面我们就来分析下在webpack项目中图片的应...

2020-05-27

98浏览

0评论

微信小程序实现左右列表联动

本文实例为大家分享了微信小程序实现左右列表联动的具体代码，供大家参考，具体内容如下效果图：直接上代码：wxml界面:<view class='header'> <text class='headerClass'>分类</tex...

2020-05-27

119浏览

0评论

微信小程序实现联动选择器

本文实例为大家分享了微信小程序实现联动选择器的具体代码，供大家参考，具体内容如下picker从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器...

2020-05-27

96浏览

0评论

微信实现自动跳转到用其他浏览器打开指定APP下载

目前的APP基本都支持二维码扫描下载，二维码下载也成为了大家用起来很顺手的一种方式。由于微信的用户基本占据了国内市场的90%，说到扫一扫用户第一个想到的就是打开微信扫一下...

2020-05-27

82浏览

0评论

jQuery实现经典的网页3D轮播图封装功能【附源码下载】

本文实例讲述了jQuery实现的网页3D轮播图封装功能。分享给大家供大家参考，具体如下：网页伪3D轮播图，其实就是轮播图旋转木马效果。其实在jquery插件库也有很多旋转木马的插件，但...

2020-05-27

70浏览

0评论

小程序实现多列选择器

本文实例为大家分享了小程序实现多列选择器的具体代码，供大家参考，具体内容如下代码分两部分，先上wxml<view class="container"> <form catchsubmit="formSubmit"> <view clas...

2020-05-27

82浏览

0评论

详解react-refetch的使用小例子

使用react-refetch来简化api获取数据的代码
const List = ({data: gists}) => { return ( <ul> {gists.map(gist => ( <li key={gist.id}>{gist.description}</li>...

2020-05-27

56浏览

0评论

微信小程序实现多个按钮的颜色状态转换

本文实例为大家分享了微信小程序实现按钮颜色状态转换的具体代码，供大家参考，具体内容如下效果图片： index.wmxl文件 <block wx:for="{{pres}}"> <view class='foot_tab' data...

2020-05-27

94浏览

0评论

微信小程序基于picker实现级联菜单

本文实例为大家分享了微信小程序实现级联菜单的具体代码，供大家参考，具体内容如下<view > <picker bindchange="bindPickerChange0" value="{{brandindex}}" range="{{brands}...

2020-05-27

66浏览

0评论

微信小程序实现购物页面左右联动

本文实例为大家分享了微信小程序实现购物页面左右联动的具体代码，供大家参考，具体内容如下效果图：wxml<view class="pro-container"> <scroll-view class="left-menu" scroll-y...

2020-05-27

67浏览

0评论

微信小程序实现商品属性联动选择

本文实例为大家分享了微信小程序实现商品属性联动选择的具体代码，供大家参考，具体内容如下效果演示：代码示例1、commodity.xml
<!-- <view class="title">属性值联动选择</view...

2020-05-27

90浏览

0评论

微信小程序时间标签和时间范围的联动效果

本文实例为大家分享了微信小程序时间标签和时间范围联动的具体代码，供大家参考，具体内容如下最近忙于一个有关数据管理的微信小程序，遇到了上图情况，虽然很简单，还是整理一下。若...

2020-05-27

106浏览

0评论

微信小程序实现展示评分结果功能

本文实例为大家分享了微信小程序实现展示评分结果的具体代码，供大家参考，具体内容如下星星评分展示1
根据评分展示整颗行星或者半颗星星星星评分展示2
根据评分按照小数点展示...

2020-05-27

107浏览

0评论

微信小程序实现工作时间段选择

本文实例为大家分享了微信小程序工作时间段选择的具体代码，供大家参考，具体内容如下1. 效果图如上，需完成时间段的选择以及下面的工作日选择保存按钮为formSubmit提交后台2...

2020-05-27

热门文章