前端例子
theOtherSky
这个作者很懒,什么都没留下…
展开
-
使用原生的 WebSocket API 在 Vue 3 中集成 WebSocket。
【代码】使用原生的 WebSocket API 在 Vue 3 中集成 WebSocket。原创 2024-04-16 15:31:58 · 796 阅读 · 0 评论 -
vue3里前端生成二维码和解析二维码(不需要后端参与)
【代码】vue3里前端生成二维码和解析二维码(不需要后端参与)原创 2024-04-10 17:29:47 · 689 阅读 · 0 评论 -
前端实现导出xlsx功能
【代码】前端实现导出xlsx功能。原创 2024-03-25 11:48:18 · 369 阅读 · 0 评论 -
react跳转和传参两种方式
需要安装ReactRouter包:两种跳转方式分别是Link和,下面跳转传参会有所展示。原创 2023-12-27 16:06:32 · 812 阅读 · 0 评论 -
react简单的函数式父子组件通信
子组件(父组件所有传值信息都可在props里获取)原创 2023-12-20 15:25:54 · 62 阅读 · 0 评论 -
高德地图简单api使用例子
【代码】高德地图简单api使用例子。原创 2023-11-23 11:48:19 · 406 阅读 · 0 评论 -
前端模拟列表的数组数据进行筛选
前端模拟列表的数组数据进行筛选原创 2023-06-08 17:10:45 · 301 阅读 · 0 评论 -
微信小程序本地上传图片到阿里云oss例子
微信小程序本地上传图片到阿里云oss例子原创 2023-03-02 17:46:19 · 445 阅读 · 0 评论 -
好看又炫酷的网页特效例子收集
好看又炫酷的网页特效例子收集原创 2022-06-16 14:41:51 · 73411 阅读 · 7 评论 -
vue3+ts实现拖拽功能
<template> <div class="about"> <h1>拖拽demo</h1> <p id="drag"></p> </div></template><script lang="ts">import { reactive, toRefs, onMounted } from "vue";export default { name: "about", .原创 2022-04-19 16:25:46 · 1382 阅读 · 0 评论 -
微信小程序-地区选择伪五级联动(选择国,省,市,县,镇)
这里采用的是自定义多列选择器pickermode="multiSelector"<view class="section"> <view class="section__title">多列选择器</view> <picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value...原创 2022-03-29 16:23:52 · 2211 阅读 · 0 评论 -
uni-生物识别模块代码(指纹,面容)
<template> <view> <view class="uni-list"> <view v-show="isFingerPrint" class="uni-list-cell uni-list-cell-pd"> <view class="uni-list-cell-db">指纹登录工资条</view> <switch :checked="fingerPrintChecked" @change.原创 2021-09-15 17:42:36 · 558 阅读 · 0 评论 -
CSS 8种让人眼前一亮的hover效果
1.发送效果<div id="send-btn"> <button> // 这里是一个svg的占位 Send </button></div>#send-btn{ display: flex; align-items: center; justify-content: center; height: 100vh;}button { background: #5f55af; border: 0原创 2020-08-27 16:18:04 · 219 阅读 · 1 评论 -
后台返回10条代码,前端处理每3条循环展示
var a = [1,2,3,4,5,6,7,8,9,0] ;var b = 0;var c = setInterval(() => { var d = a.slice(b, b += 3); console.log(d.length); if (d.length < 3) { b = 3 - d.length; d = d.concat(a.slice(0, b)); } else { } console.log(d, b, a)//d:[1,2,3]、[4,5.原创 2020-08-25 11:09:35 · 587 阅读 · 0 评论 -
纯css画出大白
废话不多说,直接上代码<!doctype html><html><head> <meta charset="utf-8"> <meta name="author" content="" /> <title>nina</title> <style> * { margin: 0; padding: 0;原创 2020-06-28 17:34:13 · 482 阅读 · 0 评论 -
搜索历史缓存
展示图html:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">原创 2020-06-24 10:03:50 · 312 阅读 · 0 评论 -
移动端H5页面适配
废话不多说,直接上代码1.rem加js适配(用原生方法获取用户设置的浏览器的字体大小(兼容ie))<!doctype html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0原创 2020-06-23 10:42:59 · 477 阅读 · 0 评论 -
简单的绝对值和阶乘的方法
简单的绝对值方法:function abs(vm){ if(vm>=0){ return vm; }else{ return -vm; }}简单的阶乘方法//方法一:function factorial1(n){ let product = 1; while(n>1){ product *= n; n--; } return product;}facto原创 2020-05-18 21:40:19 · 541 阅读 · 0 评论 -
地图经纬度渲染插件和例子
这个例子我是为了画地图覆盖物来生成经纬度(地图残缺部分就是未生成经纬度的js)废话不多说,直接上代码html页面:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-原创 2020-05-22 16:49:06 · 422 阅读 · 0 评论