- 博客(31)
- 收藏
- 关注
RSS订阅
原创 Vue3.2 setup语法糖学习与理解
起初 Vue3.0 版本暴露变量必须 return 出来，template中才能使用。现在在 vue3.2 版本只需在script标签中添加setup，组件只需引入不用注册，属性和方法也不用返回，也不用写setup函数，也不用写export default ，甚至是自定义指令也可以在我们的template中自动获得。先来一个小案例尝尝鲜，对比之前的写法少些繁琐的代码，代码看起来更简洁。组件自动注册在 script setup 中，引入的组件可以直接使用，无需再通过 components 进..
2022-03-10 11:37:26
2279
1
原创 使用uview UI工具库的时间格式化出现的问题
上面是文档说明，但按照上面的文档说明进行验证发现展示的是NAN-NAN-NAN。。。。我还以为uview没有把timeFormat（）方法注册到全局过滤器中呢，顺便查看了自己安装的uview UI版本是1.8.4，这个版本现阶段够高了，在测试中突然想到用使用10位的时间戳来试试，于是，就成功了。。原来，uview这个版本只支持10位的时间戳，还不能支持13位的时间戳。希望日后都能支持。...
2021-06-30 14:30:20
2054
原创 uni-app仿今日头条滚动tab导航
uni-app仿今日头条滚动tab导航，如下图：dom结构： <!-- 顶部选项卡 --> <scroll-view scroll-x class="scroll-row" :scroll-into-view="scrollInto" scroll-with-animation> <view v-for="(item,index) in tabBars" :key="index" .
2021-03-09 11:47:56
997
原创 vue 文章点赞和差评的代码实现
纯前端实现文章点赞与差评（支持与不支持）。需求：状态1：用户没有操作过，即既没点赞和差评；状态二：用户点赞过；状态三：用户差评过。点赞或差评过后无法取消，可切换。如下图：dom结构： <!-- 顶 --> <view class="flex-1 flex ai-center jc-center animate__animated animate__fast" hover-class="animate__jello text-main"
2021-03-08 15:50:11
787
2
原创 VueX初体验：分页存储
需求是这样的：当我在当前页【第三页】点击跳转文章详情后返回还是【第三页】，如果是tab切换跳转到其他页面返回则是从【第一页】开始当然如果用sessionStorage或localStorage也可以实现，但是还要考虑到浏览器的刷新按钮，个人觉得vueX会是一个不错的选择。因此，第一步就是看官网文档：https://vuex.vuejs.org/zh/guide/，然后安装vuex，在根目录下store下新建index.js，按文档new store并export，同时，要注意在main.j.
2021-01-27 16:07:06
553
原创 vue 动态的导航
我们要实现一个导航,可以根据后台传过来的数据进行改变的一个导航.比如后台传一个导航数据时显示:传二个导航数据时显示:传三个导航数据时显示:传四个导航数据时显示:传五个导航数据时显示:传六个导航数据时显示:传七个导航数据时显示:传8个导航数据时显示:首先第一步是要解决这个正方形的问题,链接放上:https://mp.csdn.net...
2019-01-21 15:48:34
1521
原创 关于calc()写法
今天在改导航的时候遇到的一个问题,之前我没用预处理器less写calc()时只有两个要注意的地方,一个是注意浏览器的兼容性问题,该加前缀的加前缀;第二个是减号前后都要有空格空开,不然得不到正确结果;width: -moz-calc(100% - 80px);width: -webkit-calc(100% - 80px);width: calc(100% - 80px);后面...
2019-01-21 15:09:25
5481
原创 css 实现正方形
往往在开发的时候会用到正方形,比如导航啊,图片啊,二维码啊,我就把我经常用到的写法分享出来吧,这个也是之前我的好朋友告诉我的.宽度呢,使用的是百分比,比如25%.首先html的结构是: <div class="header"> <div class="dummy"></div> <img src="https://xi...
2019-01-18 15:49:07
1662
原创 TS中的感叹号和问号的用法
今天遇到一串这样的写法：大意是获取城市数组下对应的城市编码code下的children。其中遇到的!. 和!感到很蒙圈,于是查找了下相关资料。selectArea.value = selectCity.value.find(item => item.code === val)!.children!!用在变量前表示取反。用在赋值的内容后时，使 null 和 undefined 类型可以赋值给其他类型并通过编译。interface IDemo { x?: number}l
2022-04-06 14:24:46
1932
转载 es6 object.assign()的用法
Object.assign()对象的拷贝Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。语法：Object.assign(target, ...sources) 【target：目标对象】，【souce：源对象（可多个）】const object1 = { a: 1, b: 2, c: 3};const object2 = Object.assign({c: 4, d: 5}, object1);console.l
2022-03-14 10:26:35
402
原创 常用滚动条设置
项目中常用滚动条设置1. 隐藏滚动条/* 谷歌 欧朋*/.scroll_content::-webkit-scrollbar{ display:none;} /* 火狐 */.scroll_content{ scrollbar-width: none;} /* ie 11 12 */.scroll_content{ -ms-scroll-chaining: chained; -ms-overflow-style: none; -ms-conte
2022-03-14 10:17:03
565
转载 写好 JavaScript 条件语句的小技巧5之对 所有/部分 判断使用Array.every & Array.some
array.every和array.some
2022-01-21 14:46:36
152
转载 写好 JavaScript 条件语句的小技巧之多重判断时使用 Array.includes
array.includes(),写好javascript代码，多重判断
2022-01-21 14:17:02
259
原创 Uview Select 列选择器重置不彻底的问题
关于默认值的描述：此组件的所有模式，都可以设置默认值，通过default-value数组参数配置，数组元素的0表示选中每列的哪个值(从0开始)，下面分别对几种模式进行说明：注意： default-value数组的长度，必须与列数相同，否则无效。单列模式如设置default-value为[1]表示默认选中第2个(从0开始)，[5]表示选中第6个。多列模式如设置default-value为[1, 3]表示第一列默认选中第2个，第二列默认选中第4个。多列联动模式同多列模式。现有个需求，左边内容搜.
2022-01-13 10:23:55
1295
1
原创 HbuilderX连接夜神模拟器教程
下载安装：https://www.yeshen.com/打开开发者模式：打开夜神模拟器，进入屏幕上的设置，划到设置的最后，进入关于平板电脑，多次点击版本号，退回到设置目录，会看到开发者选项，进入开发者选项，选中USB调试，或选择其他需要选项，至此已完成该步骤。hubilder设置端口号：夜神模拟器端口号：62001右键夜神模拟器的快捷方式打开安装目录拷贝安装目录 D:\Program Files\Nox\bin右键HBuilder 快捷方式打开安装目录拷贝安装目录 E:\worksoftwar
2021-11-16 15:27:54
2916
原创 uview的u-tag徽章点击切换出现移动问题
faultList: [ { name: '接触不良', selected: false }, { name: '保险脱离', selected: false }, { name: '电源脱离', selected: false }, { name: '视频头脱离', selected: false }, { name: '无信号', s
2021-07-07 17:20:24
1826
原创 安装uView
HbuilderX创建项目之后…如果您的项目是由HBuilder X创建的，相信已经安装scss插件，如果没有，请在HX菜单的 工具->插件安装中找到"scss/sass编译"插件进行安装， 如不生效，重启HX即可。安装uview1.将下载后的uview-ui文件夹，复制到项目根目录。2.在mian.js下引入：// 引入全局uViewimport uView from 'uview-ui';Vue.use(uView);3.uni.scss中引入全局SCSS主题文件：这里很大程度
2021-06-03 14:41:12
334
转载 vue点击事件 根据条件判断是否可以点击
需求：根据特定条件，增加或者去掉click事件（例如：clickFlag == true时，添加click事件；clickFlag == false时，去掉click事件；）解决方法：方式一：在绑定事件中直接添加标示量clickFlag<div @click="clickFlag && addGoodsHandler()"> 为真 </div><div v-else> 为假</div>方...
2021-03-05 16:49:50
9561
3
原创 lastIndexOf（）方法和substring（）方法
lastIndexOf（）从数组后面开始往前查找第一次出现的目标数，并且返回它正常的索引值。未找到返回-1 substring（start）方法用于提取字符串中介于两个指定下标之间的字符。substring() 方法返回的子串包括start处的字符，但不包括stop处的字符。举例：let routes=[ { meta:{title:'后台首页'}, component:'index/index' }, { meta:{title:'商品列表...
2020-07-15 17:27:11
711
原创 iview 表格选中触发的事件
在后台管理系统写表格时，默认每行数据前都有一个选择按钮，一般是选择选中删除，因此，就有多选删除，单选删除，全选删除。下面iview的文档说明：通过给columns数据设置一项，指定type: 'selection'，即可自动开启多选功能。给 data 项设置特殊 key_checked: true可以默认选中当前项。给 data 项设置特殊 key_disabled: true可以禁止选择当前项。正确使用好以下事件，可以达到需要的效果：@on-select，选中某一项...
2020-07-03 17:13:40
2008
1
原创 VsCode 中使用less遇到的本地报错一个问题
在练习项目中引入less.js，使用less提高我们css效率，然后，在编辑器中打开后下图所示：之前我的VsCode 中安装了一些个插件，比如open in brower，打开后就是如此，后来查看一些个资料，由于浏览器端使用Less时，是使用 ajax 来拉取 .less 文件，如果直接在本机文件系统打开（即地址是file://开头）或者是有跨域的情况下，会拉取不到 .less 文件，导致样式无法生效。因此，必须在http(s)协议下使用，即必须在服务器环境下使用。一般我们会在本地开发和
2020-06-18 09:37:11
1205
原创 uni-app 微信小程序分享按钮
uni-app 微信小程序分享按钮官方文档说明在 manifest.json 的 App SDK 配置里，勾选微信消息及朋友圈，并填写相关 appkey，微信 appkey在需要分享的页面填写： <!-- #ifdef MP-WEIXIN --> <button class="share-btn" open-type="share">分享</button&...
2019-11-29 18:29:59
8482
原创 vscode 中的Markdown插件
markdown插件Markdown Preview EnhancedMarkdown Preview Enhanced是一个很好用的完善预览功能的插件，可以更加形象的展示所编写的pdf格式的文档样式。在插件库中搜索markdown即可找到该插件，然后点击安装后重新加载。Markdown All in OneMarkdown All in One如果想要将md文档转换为HTML则需要...
2019-11-09 10:31:59
416
翻译 markdown学习
Markdown 致力于使阅读和创作文档变得容易基础语法标题Markdown支持6种级别的标题，对应html标签 h1 ~ h6 # h1 ## h2 ### h3 #### h4 ##### h5 ###### h6以上标记效果如下：h1h2h3h4h5h6段落与区块引用Markdown提供了一个特殊符号>用于段首进...
2019-11-09 03:28:53
223
转载 cube ui 的安装
npm install cube-ui --savecube-ui 搭配 webpack 2+ 支持后编译和普通编译 2 种构建方式（默认使用后编译），使用前都需要修改应用的依赖和配置。普通编译修改 package.json 并安装依赖... "scripts": { "dev": "webpack-dev-server --inline --prog...
2019-06-12 13:03:20
2018
原创 小程序点赞样式的编写
往往需要写到点赞的功能，并且显示点赞数，如图：wxml中输入：<view class="like"> <image src='images/like.png'></image> <text>9</text></view>wxss中输入：.like{ display: flex; f...
2019-04-16 23:19:15
883
原创 LocalStorage存储JSON对象
今天用了localstorge存储一下json对象,发现在控制台上面看到是[object Object],然后百度看了一下,原来localStorage.setItem() 不会自动将Json对象转成字符串形式,因此,存储前先用JSON.stringify()方法将json对象转换成字符串形式, JSON.stringify()方法可以将任意的 JavaScript 值序列化成 JSON ...
2019-01-29 11:46:40
1811
原创 文字超出省略号
单行文字超出省略号.det { width: 200px; overflow: hidden; text-overflow: ellipsis; white-scaple: nowrap;}多行文字超出省略号.det { width:200px; display: -webkit-box; -webkit-box-orien...
2018-12-12 11:03:13
173
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人