![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 62
前端
闲猫
大道至简
展开
-
微信小程序.日期组件
缘起微信小程序官方提供的picker样式不好控制,跟其他样式不统一,也没法进行其他操作,不如自定义一个,使用:picker-view封装为一个组件。 代码现成,直接复制过去用吧。效果组件代码haiweidate.wxml<view class="container"> <view class="page-body"> <view wx:if="{{showTitle === 'true'}}" class="selected-date"&.原创 2022-05-28 21:35:51 · 1565 阅读 · 2 评论 -
微信小程序.原生.Tabbar 颜色变量 像素换算 缓存 给页面传数据
Tabbar效果:apps.json中添加tabbar: "tabBar": { "list": [{ "pagePath": "pagePath", "text": "text", "iconPath": "iconPath", "selectedIconPath": "selectedIconPath" }] }注意:图片可以去iconf原创 2022-05-25 13:08:08 · 194 阅读 · 0 评论 -
微信小程序.原始.初始化框架搞代码顺序
创建小程序,精简一些文件删除log 清空index中的样式和js逻辑 添加styles components lib request icons utils空文件夹 如果设计好页面,在app.json中添加页面(这个需要在前期分析好),最好能搞个表格啥的添加第三方组件图标,eg:iconfont的引入; icon:tabbar图片引入 lib引入,eg:runtime主页框架搭建tabbar搭建(页面,字体颜色等) 全局样式:主题颜色(变量),字体 ; 主要标签的初始化...原创 2022-05-25 13:03:54 · 284 阅读 · 0 评论 -
微信小程序中支持Es7的async语法:号称是解决回调的最终⽅案
引入:1. 在⼩程序的开发⼯具中,勾选 es6转es5语法 2. 下载runtime.js 文件:regenerator/runtime.js at 5703a79746fffc152600fdcef46ba9230671025a · facebook/regenerator · GitHubhttps://github.com/facebook/regenerator/blob/5703a79746fffc152600fdcef46ba9230671025a/packages/regenerato原创 2022-05-25 13:00:14 · 348 阅读 · 0 评论 -
微信小程序.原生.轮播图
示例代码:<view class="index_swiper"> <swiper circular indicator-dots autoplay> <swiper-item> <image mode="widthFix" src="https://api-hmugo-web.itheima.net/pyg/banner1.png"/> </swiper-item> <swiper-ite...原创 2022-05-25 12:53:25 · 259 阅读 · 0 评论 -
微信小程序.原生.自定义组件
创建自定义组件:新建文件,使用slot插槽,注册,使用在components文件夹下新建Searcher文件夹在“微信开发者工具”中,新建component,输入:Searcher注册:在使用页面的json文件中usingComponents项添加组件,路径要相对路径传html(slot插槽)和传值组件内:<view class="search_input"> <navigator url="">搜索{{param}}</navigator&g.原创 2022-05-25 12:49:40 · 437 阅读 · 0 评论 -
微信小程序.阿里巴巴矢量图标库iconfont使用
场景前端图标:Iconfont 介绍Iconfont 是阿里提供了一个图标库,你可以想象成是一个售卖图标的超市,挑选你需要的图标放入购物车,然后 Iconfont 会为你打包你购物车里的图标,自动生成一种新的字体,你可以选择下载到本地,在你的项目中引入这种字体,这样即便没有网络的情况也可以使用图标。这种模式的一大优点就是只挑选出需要的图标,不会像其他图标库那样直接下载一整个图标库的内容,尽管你可能只会使用到其中一到两个图标。要知道,有的项目打包上线对大小是有严格要求的,比如微信小程.原创 2022-05-25 12:45:15 · 787 阅读 · 0 评论 -
Css display:flex
使用场景在c1中设置标签为display:flex;flex-direction:column决定子元素的排列方式<view class="c1"> <view class="cc">11</view> <view class="cc">22</view> <view class="cc1">33</view> <view class="cc1">44</view> &l原创 2022-05-25 12:37:40 · 529 阅读 · 0 评论 -
CSS.box-sizing属性(让你看到不同的解释,直达问题本质)
前言css中width属性经常用,但这个属性本来就含义不清楚,如果没有边框和填充当然没问题,如果设置了,再不明白box-sizing样式就容易出问题。搜了几篇文章,讲的各种糊涂。下面请你看完,你才能明白box-sizing属性的设计最初思想, 一次性搞懂再也不管了。实际场景物流体积计算冲突想一个场景:物流按照体积计费,那这个宽高按照啥计费呢?如下图:如果按照外边计费消费者亏了,如果按照里边计费,物流商占不到便宜。差距在哪呢:纸箱子的厚度和里边填充的泡沫的厚度运输的两种场景.原创 2022-05-15 11:08:37 · 1116 阅读 · 10 评论 -
Css.position(static,sticky,fixed,relative,absolute)
如果html中的元素想跳出html排版,就需要用position属性position取值:static,sticky,fixed,relative,absolute结合使用的属性:top,left,bottom,right 取回 1px简单区分static :默认,就是普通的标签sticky:有滚动条的时候,会粘到顶部或者底部fixed:固定位置,滚动条怎么搞也没用relative:在修饰标签的位置为参考系,使用top,left控制absolute:按照屏幕作为参考系原创 2022-05-13 13:09:44 · 209 阅读 · 0 评论 -
Vue.Demo搭建(迈出第一步)
环境准备node环境npm环境vue-cli环境创建工程vue init webpack 项目名称项目名称都是小写字符vue init webpack demo1备注:Project name:项目名称,只能全小写,为什么必须全小写,据说是方便不同系统之间的移植(可移植性?)Project description:项目说明,随意啦,默认也行Author:作者名Vue build:默认选中了Runtime + Compiler(运行时编译),既然他推荐这个,原创 2022-04-19 18:48:00 · 2811 阅读 · 0 评论 -
Vue.环境准备
安装nodejs(包括npm)下载链接:Node.js推荐使用第一个链接,比较稳定。下载后,双击开始安装,如下图:点击Finish完成验证:node -vnpm -v配置npm的本地仓库https://blog.csdn.net/Sindyue/article/details/104051363配置npm默认地址cnpm安装参考:https://blog.csdn.net/Sindyue/article/details/10405136..原创 2022-04-19 18:40:05 · 576 阅读 · 0 评论 -
Vue.前端各组件介绍(Node,Express,CommonJS,Npm,Cnpm,Nrm,Webpack)
NodeJS简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。类比:相当于JS的JVM,只要安装了Node就可以使用JS进行开发了。Express有了Node这个JVM,大牛就开始用JS写各种模块和框架了。比如MVC框架(原创 2022-04-19 18:35:49 · 683 阅读 · 0 评论