- 博客(159)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 【let var const】
块级作用域let和const有块级作用域,var没有let和const在同一作用域中都不可以重复说明,var可以推荐使用letJS文件引入方法：新建aa.js文件，在html文件中引入var会直接改变window对象，是不合理的，当声明的变量与window变量正好一样是，就会覆盖window变量，让其不能正常操作显示let 不会直接改变window对象，当声明的变量与window变量正好一样是，不会覆盖window变量，更推荐使用传值：传址null和undefined函数没有返回值，参数
2022-06-28 19:48:52
215
1
原创 排序、计时器
数组元素由大到小依次排列设置一个每隔2s输出一个数字的功能，从1开始 1、2、3、4、5、、、、、、、、（每个2s自动输出，就像计时器一样）
2022-05-30 16:36:18
185
原创 时间戳、返回毫秒数并转换成对应时间、添加删除插入替换调位数组元素、价格的排序、过滤、查找最高值、计算商品总价
时间戳（字符串类型和时间类型）返回总毫秒数（四种方式）将后毫秒数转换成相对应的时间；
2022-05-30 14:11:07
161
1
原创 【无标题】
视频教程完成“快速返回顶部”功能/ 当接口数据中已存在当前页和总页数时，如何进行上拉加载等功能注意代码中this.data的data指的是什么<template> <view> <!-- 快速返回顶部 --> <uni-list> <uni-list-item v-for="(item,index) in data.data" :key="index" :title="item.title" :note="item.pric
2022-05-20 17:56:15
62
原创 渲染列表，上拉加载提示数据加载中，没有数据后停止，下拉刷新数据，书信成功后关闭转圈动画
<template> <view> <uni-list> <uni-list-item v-for="(item,index) in result" :key="index" :title="item.title" :thumb="item.image" thumbSize="lg" :note="item.passtime"></uni-list-item> </uni-list> <!-- 如果不.
2022-05-20 14:59:44
322
原创 上传图片 预览图片 uni-app
实现点击上传图片按钮后，自动弹出文件夹选取图片然后就会发现图片已经上传成功,数据已经获取实现方法 请看代码（uni-app）<button type="primary" @click="chooseImg">上传图片</button>、、、、、、、、methods: { chooseImg(){ uni.chooseImage({ //chooseImage方法（固定）是专门用来完成图片上传的 count: 5, //限制图片上传的数量
2022-05-12 14:03:03
239
原创 点击按钮 进行数据存储 删除 获取
<button type="primary" @click="setStorage">存储数据</button><button type="primary" @click="getStorage">获取数据</button><button type="primary" @click="removeId">移除数据</button>methods: { //本地缓存 存储、获取、删除数据 //在控制台 应用>
2022-05-12 10:35:06
501
原创 【h5引入组件、运行浏览器图标报错】
引入组件页面A1<A1>import A1 from './components/A1.vue'components: { A1}使用webstorm软件运行H5项目时 点击浏览器图标时报错 解决方法：解决方法：第一，找到这个浏览器所在的位置，右击查看属性 复制所在路径，复制该位置到下面 如图所示：选中历览器 邮寄查看属性并复制文件地址将复制的路径粘贴到对应的位置，然后🆗就没啥事了...
2022-05-12 10:30:45
208
原创 【提交评论、制作购物车加购总计页面】
制作一个评论提交功能购物车加购总计页面的制作代码如下：<template> <div> <header>我的购物车</header> <div class="container"> <div class="item" v-for="(item,index) in shopCar" :key="index"> <div class="logo">
2022-05-09 15:11:26
240
原创 【时间戳 过滤器】
实现效果：2022-05-05 14:37:03视频教程、、、、、、、<p>完整版：{{date | dateString}}</p><p>年-月-日：{{date | dateString('YYYY-MM-DD')}}</p><p>时分秒：{{date | dateString('HH:mm:ss')}}</p>//<!--将获取到的当前时间的值date传递给dateString,具体格式由dateString自
2022-05-05 15:32:45
197
原创 【点击按钮显示/隐藏 带动画效果】
实现点击按钮后带动画显示内容，再次点击后进行隐藏，具体参考这个视频教程<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta NAME="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"> <title>动画效果</title
2022-05-05 12:01:57
949
原创 【无标题】
结合APEX组件的分页器实现点击后切换页面的部分内容的功能1.引入各个页面将各个页面与分页器部分进行数据联动<import name="voice" src="../voice/index.ux"></import><import name="signIn" src="../signIn/index.ux"></import><import name="writing" src="../Writing/index.ux"></im
2022-05-05 10:54:59
96
原创 GitHub的使用
从GitHub上创建项目并拉取下来到本地构建成功后 是一个空的远程项目，如果想把现有的项目放在这个远程项目里，可打开文件夹 进行复制粘贴拷贝地址把现有的项目放在这个远程项目里，可打开现有的文件夹 进行复制粘贴（）拷贝进来后会发现文件名时红色的。需要cd 到这个文件夹//cd supermall然后git add .将所有文件加入进来接着git commit -m '初始化项目'就提交了然后写入自己dithub的账号 密码 就可以看到了...
2022-04-28 15:48:38
204
原创 axios请求方式的基本使用和并发请求
axios的基本使用：axios({ url:'http://123.207.32.32:8000/home/multidata',}).then(res => { console.log(res);})axios({ url:'http://123.207.32.32:8000/home/data', //专门针对GET请求的参数拼接 //（事实上就是将http://123.207.32.32:8000/home/data?type=pop&page=1拆分成了这种形式.
2022-04-27 17:20:40
1401
原创 【点击分类 进入商品页面 继续点击 进入商品详情页面】
实现思路：主页面（商品分类）：点击类别按钮，跳转商品页面商品页面（商品列表）：点击某个商品，跳转商品详情页商品详情页（调用接口）：调用接口，渲染商品详细信息主页面：先创建好这四个分类的页面（Inseason 、 Place 、Effect 、NutritionClass ）//Inseason ： 当季 <div class="item item1" @click="centerRouter('Inseason')"> <img src=""/>
2022-04-27 11:48:20
4455
原创 添加/删除/筛选/排序数组元素
添加/删除/筛选/排序数组元素在数组末尾继续添加元素 pushvar arr = [1,2,3];arr.push(4,5,'kkk');console.log(arr);在数组开头添加元素 unshiftvar arr = [1,2,3];arr.unshift('red');console.log(arr);删除数组的最后一个元素 pop()arr.pop(); //不需要再（）里写任何元素删除数组的第一个元素 shift()arr.shift();
2022-04-22 15:54:43
93
原创 倒计时案例
案例分析核心算法：输入时间 - 当前时间 = 剩余的时间时间戳计算：输入时间的总毫秒数 - 当前时间的总毫秒数 = 剩余的总毫秒数把剩余的总毫秒数转换成天、时、分、秒 来显示剩余时间毫秒数转时分秒的转换公式：d = parselnt(总秒数/60/60/24); //计算天数h = parselnt(总秒数/60/60%24); //计算小时m = parselnt(总秒数/60%60); //计算分数s = parselnt(总秒数%60); //计算当前秒数封装此方法：(
2022-04-22 14:52:57
193
原创 时间日期格式化
当前时间格式化（08:12:03）// 输出当前时间（带0） // 08:12:03 var date = new Date(), function getTime(){ var time = new Date(); var h = time.getHours(); h = h < 10 ? '0' + h : h; var m = time.getMinutes(); m = m < 10 ? '0' + m : m; var s
2022-04-22 14:19:39
827
原创 最常用的前端
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta NAME="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"> <title>Title</title> <script src="https://cd.
2022-04-22 11:06:01
100
原创 箭头函数、递归算法、this、闭包、防抖
使用箭头函数按条件输出let e = [1,2,3,4,5,6,7,8,9].filter((value,index) => value <= 3);console.log(e)//打印出的结果：[1,2,3]let sum = [1,2,3,4,5,6].reduce((a,b) => a+b);console.log(sum)//打印出的结果：21递归算法function factorial(num){ return num = 1 ? 1:num * factor
2022-04-19 18:20:12
1214
原创 【无标题】点击分类 跳转页面 展示详细信息
通过调用接口渲染分类页面，绑定数据点击各个商品类型后通过id跳转详细商铺列表信息在商铺列表页面3.点击title后商铺信息页面也随之前换通过id将title和下方内容绑定 当title切换时 下方商铺列表也随之改变需调用商铺列表接口调用商铺的假数据接口需要处理，真实数据接口即可渲染数据的时候 进行了页面渲染的显示方式：每次页面一开始只显示五条数据，一次上拉加载 加载后出席那的数据要求不被覆盖，均呈现在页面上4.点击各个商铺后进入其详情页面商法列表想代码有点儿问题 在这儿修.
2022-04-14 17:44:44
253
原创 JSON.
JSON.parse()方法用来解析JSON字符串，构造由字符串描述的JavaScript值或对象。不允许逗号作为结尾，使用分号JSON.parse('{}'); // {}JSON.parse('true'); // trueJSON.parse('"foo"'); // "foo"JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]JSON.parse('null'); .
2022-04-11 15:51:37
628
原创 列表渲染的三种方式
根据元素 和元素的索引名 就可进行列表渲染for="{{list}}"：list为源数据数组，默认的数组元素名为$itemfor="{{value in list}}"：value为自定义的数组元素名，默认的数组元素索引名为$idxfor="{{(index, value) in list}}"：index为自定义的数组元素索引名，value为自定义的数组元素名<import name="tabbarpage" src="../Tabbar/index.ux"></import.
2022-04-08 09:52:01
844
原创 【无标题】记事本内容编写区
HTML<div> <div> //标题 <div> <input type="text" placeholder="标题..." value="{{title}}" //在data处定义title变量 maxlength="20" //最多输入20 个字 onchange="getTitle" /> </div>.
2022-04-07 11:53:01
101
原创 快应用模糊搜索
步骤：先判断数据是否为空，为空时表明当前数据为空 <div if="{{memoList.length === 0}}"> </div>否则不为空，建立搜索部分和列表部分（在同一个div中）html<div else> 搜索部分 <div><input onchange="goSearch()" placeholder="搜索备忘"/></div> 列表部分 <div for="searchL..
2022-04-06 18:13:22
457
原创 搞懂Promise async await 之间的联系
在js中右两种实现异步操作的方式：一、回调函数比如使用setTimeout()让一个传入的回调函数在指定时间后才执行setTimeout(() => { console.log("哈喽");},3000);这种方法虽然简单易懂，但是当需要一次执行多个异步操作时，程序就会一层一层的嵌套执行（所谓的回调地狱），所以就出现了promise函数二、Promise链式调用优点：它可以用一种链式结构将多个异步操作串联起来，避免了链式的层层嵌套fetch: 是JS中使用Promise的API，
2022-04-06 14:02:42
529
原创 转义符\ 数据格式的拼接
转义符let vv = "vvlikeVV"console.log(vv)document.write(vv)如果想让输出的样子为：vv“like”VV，就可以使用转义符\即可let vv = "vv\"like\"VV"如果想让输出的样子为：vv like VV，中间有间隙，就可以使用转义符\t即可html里的空格可以用 let vv = "vv\tlike\t\tVV"\n表示换行数据连接小明出生于2020年。let year = "2020年";
2022-04-02 16:50:51
272
原创 【点击某一行后背景颜色发生改变】
html<ul> <li></li> <li></li> <li></li></ul>jslet list = document.querySelectorAll('li');for (const li of list) { //使用for of方法 //console.log(li) 就能看到打印出三行列表 li.addEventListener('click', function().
2022-04-02 15:48:51
410
原创 【三角形 杨辉三角 打印奇偶数循环 js for break 循环】
1.打印三角形for ( let i=0; i<10; i++) { for ( let n=0; n<i; n++ ){ document.write("*"); } document.write("<br/>");}2.杨辉三角// 4 3 2 1 for ( let i=0; i<5; i++) { for ( let n=5-i; n>0; n-- ){ document.write("^"); }// 1 3 5 7 f
2022-04-02 15:18:28
333
1
原创 通过js创建单元格（while循环）
<script>function table(options = { tr: 5, td: 3 }) {document.write(`<table border="1" width="100%>`)}</script>
2022-04-02 14:20:18
581
原创 switch和if的简单基本使用
用switch方法判断该年龄属于哪类人群一般相对较为复杂的条件判断时就可以使用IF语句进行判断default: 当所有参数都不匹配的时候 就打印default执行的内容1.switch方法<script> function message(age) { let msg = " ", switch (true) { //此处switch(2>1)也可正常执行，因为2>1为真 case age > 60 : msg = "老年"; br
2022-04-02 11:38:33
317
原创 Apex上拉菜单（编辑、置顶、删除、取消）
引入Apex的上拉菜单组件/*图标*/<import name="my-icon" src="apex-ui/components/icon/index"></import>/*上拉菜单*/ <import name="my-action-sheet" src="apex-ui/components/action-sheet/index"></import>html<div class="btn"><!-- 多功能按钮 -.
2022-04-01 18:13:08
576
原创 数据/组件绑定的各种情况
<template> <div class="wrapper"> <!-- 数据绑定 --> <text class="title">数据绑定：{{ title }}</text> <!-- 事件绑定 --> <text @click="press" class="bt">事件绑定：{{ click }}</text> <!-- 列表渲染 --> .
2022-03-21 11:32:13
130
原创 在components文件夹下创建Tabbar组件，公用
在components文件夹中创建tabbar.ux文件接着同样创建这三个文件（自定义 main watting me）在tabbar.ux文件下写页面底部<template> <div class="bar-wrap"> <div class="bar-item" onclick="clickBar('main')"> <image src="{{current === 'main' ? '/assets/im
2022-03-18 16:30:43
776
原创 快应用底部导航栏
代码如下：<template> <div class="wrapper"> <!-- tab导航 --> <div class="fix-bar"> <!-- 首页 --> <div class="bar index" @click="tabClick('Index')"> <image class="img" src="/a..
2022-03-17 15:13:00
431
空空如也
css js 是怎样结合的
2021-07-05
TA创建的收藏夹 TA关注的收藏夹
TA关注的人