Arc'teryx以700亿元人民币上市，安踏的并购之旅还能持续多久？
06-17
雷锋网注：本文作者：程序员作者博卡君。
雷锋网已获得作者授权发布。
未经授权禁止转载！今天充满了波折，我承受的压力和痛苦比我预想的还要多。
最后，我决定继续发布我的更新教程。
我认为我没有泄露公司的代码，也没有提供泄露的开发工具供下载。
我只是从程序员的角度写了一篇开发日志。
我已经做好了最坏的准备。
即使我放弃这份工作，我也会将完成的教程交给名片盒团队继续更新发布！如果你这样做了，你将永远不会后悔！只是博卡君水平有限，还请大家对这篇文章多一些宽容。
多于！让我们开始吧： 提示：API 第三章：微信小程序项目结构和配置 找到创建的 demo 文件夹并将项目导入到编辑器中。
这里使用的是Sublime Text编辑器。
这时候就需要根据自己的项目需求改变结构了。
项目根目录下面是首页渲染的几个tabBar页面，以及app的一些配置文件。
例如，tabBar名片盒项目有3个切换菜单：我们首先找到应用程序。
打开json文件配置这些菜单，配置“tabBar”，把配置文件改成自己的设计就可以了。
App.json中有几个配置项： Pages：这是写的js文件。
这里不需要使用后缀.js。
配置正确的路径就可以正常应用了（如果不能应用，重启微信开发者工具就会直接报页面错误）。
Window：顶部配置一些样式，文档比较详细。
tabBar：底部的几个配置是众所周知的。
networkTimeout：我还没发现有什么用处。
建议阅读文档。
根据项目实际需要进行补充和修改。
iconPath 和 selectedIconPath：通过切换点击来突出显示底部菜单按钮图像。
“文本”：您可以将其删除。
如果全部去掉，你会发现底部塔栏的高度会降低很多。
Json文件配置完成后，根据项目创建该文件。
演示：存储假数据。
这个时期的开发工具需要支持。
假数据采用 .js 文件的形式。
里面的数据结构与json一致，暴露数据。
就是这样。
然后拿到需要的数据进来就可以了，使用起来非常方便； Images：图像路径；页面：tabar以外的页面； Servise：服务交付层（与后台联合调试真实数据时使用）； wxss：一些公共的css文件。
看到这里，大家发现每个页面都关联着三个不同的后缀。
目前只能通过这种方式来实现页面、css、js的分离。
它是微信应用账号的标准。
Wxss文件导入你写的样式文件，也可以直接在里面写样式。
所有Js文件必须在页面中配置才能生效。
下一章：微信小程序首页开发。
第四章：微信小程序首页开发 经过各种准备和配置，我们来到了首页开发。
首先需要实现首页效果图，如下所示： 模板 名片有很多，需要用到模板。
这里微信需要提供的基本组件大致就是input（搜索框）、action-sheet（右边是一个底部下拉菜单，需要一个下拉菜单）、Scroll-view（右边??ABC跳转） ），（目前的实现仍然存在一些问题，正在克服中）。
View是一个块元素，是整个搜索框的样式。
名片夹：由于本项目主打名片功能，使用的地方很多，所以需要将名片分成模板。
模板：定义模板。
模板的名称实际上是一个范围。
块：循环控制。
名片很多，必须循环拿出来。
类似于很多前端框架操作数据的循环。
支持自定义属性数据，用于判断线上线下名片。
View中有一些数据引入，支持三元运算符。
引入模板非常方便。
is与name相同，data填充nameData传递的数据。
一切都以数据为中心。
获取数据的具体操作取决于你的数据结构：这里的数据结构和json数据结构是一样的。
如果要传给页面的话就是 this.setData({nameData:card_list_name.data.cards,timeData:card_list_time.data.cards} );因为页面遍历了nameData和timeData，所以你可以看一下打印出来的数据结构，根据你的结构解析传输。
您还可以在这里查看一些对数据的操作。
（这个必须按照定义的json数据格式来操作）由于很多页面需要使用名片的样式，所以放在common.css中。
所有页面和一些初始化设置都需要此 common.css。
只有在pp.wxss中引用后才能映射到全局APP。
搜索框：bindChange是输入框的change事件。
微信提供的bindchange在支持方面还存在一些小问题。
目前，该事件仅在失去焦点时触发。
后续会完善，先实现该功能。
bindInputChange:function(e){//发生搜索事件 var self = this; //这个绑定，this this指向微信提供的窗口 var Text = e.detail.value.toUpperCase();//获取输入内容 if (Text==""){ //如果输入为空，需要显示某些内容，否则不会显示 show_letter = "block";}else{ show_letter= "none";}this.setData({ show_letter:show_letter, showSheet:true} );var res = nameData;获取传入的数据 if(data_type=="name"){}else if(data_type=="time"){ res= timeData;};for(var k in res){ // for-in 循环获取卡片var in data data =res[k].cards;for(var i =0;i 触发条件在这里。 一切都从绑定事件开始：bindButtonTapSheet:function(e){//调用底部下拉菜单栏}还是要先布局才可以调动。 js配置：数据初始化数据：这里要取一个false值，直接设置为false就调不出来了：调用事件。 调用完后要删除：可以像下面一样取消，直接上传事件。 （分为菜单栏外侧和底部） //好吧，就是这么简单。 效果实现起来很简单，体验确实很好。 还需要一个加载效果（暂时没有动画，稍后我们会考虑。 ）Loading布局首页最外层视图是基于微信的生命周期的。 Onload:function(e){this.setData({toastDisplay:”block”,htmlWrapDisplay:”none”})},onShow:function(e){this. setData({toastDisplay:”none”,htmlWrapDisplay:”block”})}加载栏完成。 扫描直接调用拍照功能。 从这里可以看出，微信提供的相机API使用起来非常快，你只需要根据自己的需求进行配置即可。 点击扫描后，在开发者工具中可以看到如下效果。 这里解释一下，DOM长度有限，页面结构太长，无法渲染。 暂时取消了公司排序。 左边的ABC跳还在完善中。 还有向左滑动删除名片的功能。 遗憾的是微信没有提供这个功能，这个功能在移动端非常实用。 我得花点时间自己把后续的改进写下来。
版权声明：本文内容由互联网用户自发贡献，本站不拥有所有权，不承担相关法律责任。如果发现本站有涉嫌抄袭的内容，欢迎发送邮件 举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。
标签：
相关文章
06-18
06-17
06-18
06-21
06-17
06-18
最新文章
三只松鼠：门店扩张已全面暂停
Nvidia 已准备好“统治”AI
【创业24小时】2023年11月16日
【创业24小时】2022年10月20日
倒计时一天，浙江这座小镇要火了！
沃图网络获数千万A轮投资，加大投入海外网红营销SaaS平台建设
泰山天使基金部分退出拉手半年回报180倍
西格数据完成1000万元A+轮融资，国发创投领投