配置项(关于使用组件) index.wxml <!-- tabBar:tabBar配置 activeIndex: 激活页面下标 slots: 多插槽配置(需与页面一致) --> <tabbar data="{{tabBar}}" activeIndex="0" solts="{{solts}}"> <view slot="index">index1...</view> <v

Mac上微信小程序官方开发工具打开后卡死,无法操作,也关不掉,解决方案: 三步: 1.在应用中删除“微信web开发者工具” 2.删除一下几个配置和缓存文件: 1.-/Library/Application Support/微信web开发者工具 2.~/Library/Preferences/com.tencent.wechat.devtools.plist 3.~/Library/Caches/微信web开发者工具 3.重新安装“微信web开发者工具”

原文:微信小程序把玩(三)tabBar底部导航 tabBar相对而言用的还是比较多的,但是用起来并没有难,在app.json中配置下tabBar即可,注意tabBar至少需要两个最多五个Item选项 主要属性: 对于tabBar整体属性设置: 对于tabBar中每个Item属性设置: 下面是官网一张图对tabBar描述: app.json的配置相对就简单了:

接 <微信小程序结合原生JS实现电商模板(一)>,在首页列表加入购物车到购物和模块增删数量,动态计算商品价格实现后,本次提交主要实现了商品详情(还不完善)简单页面,从商品详情页跳转到购物车,加入购物车和立即购买的逻辑实现:购物车结算功能完善(需添加收货地址才能结算,并完善新增.编辑.删除地址相关操作):在分类模块实现了商品的分类展示以及不同分类对应的数据流显示,以及进入详情的逻辑操作.请不要吝啬你的发财手帮我star或转发一下,谢谢了.下面附上目前的效果:(切图自己抠的,请见谅.) 附上源码地

关于本文的所有观点都是网上收集,与作者本人没有任何关系! 最近朋友圈已经被微信小程序刷屏了,这也难怪,腾讯的产品拥有广泛的影响力,谁便推出个东西,都会有很多人认为会改变世界,这不,张小龙刚一发布微信小程序的消息,很多人(技术的和非技术的)就跟打了鸡血似的,估计现在已经鸡血告急了! 我也看了网上的一些关于微信小程序的文章,估计那帮家伙连微信小程序是什么都没搞清楚,就在那里一本正经地胡说八道.好吧,我就通过本文让大家了解一些什么是微信小程序,以及微信小程序到底能为我们带来什么. 关于微信小程序的误解

最近微信小程序很火,很喜欢那种轻应用,用完就走的理念.于是,下载好微信开发者工具,学习一下官方demo. 体验下来,有类似react和vue的感觉,dom类似react那种组件的,data-binding和vue类似. 1 注册 到微信公众平台申请账号,https://mp.weixin.qq.com/,并且绑定管理员账户方便上机调试. 下载微信开发者工具,登录管理员微信账户. 2 初始 创建项目并初始化,输入第一步生成的AppID. 3 目录结构 其中,.js后缀的是脚本文件,.json后缀的

以前做小程序为了应急找了个插件去链接WebSokcet,文章传送门. 回过头在新项目中再次使用时出现了些许问题,不一一赘述.遂决定好好用一下原生的WebSokcet. 一.说明 1.小程序原生的WebSokcet没有断线重连机制,这个是他的不足之处. 2.小程序新的版本库已经支持存在多个 WebSokcet 连接.   官方说明:基础库 1.7.0 之前,一个微信小程序同时只能有一个 WebSocket 连接,如果当前已存在一个 WebSocket 连接,会自动关闭该连接,并重新创建一个 Web

重新启动微信小程序编辑器的时候遇到了这样的一个问题: tabBar.list[3].selectedIconPath 大小超过 40kb 微信小程序开发的过程之中总会出现这样或者那样的错误,需要我们耐心的去寻找,仔细查看和百度查询之后,发现了原因:其中有一张图片,替换的时候没有注意图片大小,导致项目无法预览. 参考了一下微信小程序的官方API,查看tabBar list定义说明:也就是说选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,而我新加入的头像尺寸过大.

如何离开含有tabbar的页面 在微信小程序开发过程中,我们会碰到从某页跳转到一个含有tabbar的页面的需求, 用 wx.navigateTo({url: '...',})  不起作用,需要使用 wx.switchTab({url: '...',}) 来实现. 那么,我们反过来,如何从含有tabbar的页面跳转到一个不含有/隐藏了tabbar的页面呢? 在尝试了上述的两个API后发现不起作用,wx.switchTab({url: '...',}) 倒是可以在有tabbar的页面之间跳转,但无法

1,底部导航栏这个功能是非常常见的一个功能,基本上一个完成的app,都会存在一个导航栏,那么微信小程序的导航栏该怎么实现呢?经过无数的踩坑,终于实现了,好了,先看看效果图. 2,对于底部导航栏,小程序上给出的文档要求里面的item最少2个,最多五个. 3,在项目中找到app.json这个文件 { "pages":[ "pages/index/index", "pages/logs/logs", "pages/mine/mine"

在微信小程序的开发过程中如果有使用过tabbar的同学,我相信一定会遇到一些困扰.为什么有些时候代码中明明已经在app.json里面增加了tabbar,可以页面中就是不显示呢?可不可以有些页面显示tabbar,而有些页面不显示tabbar呢?今天我把我在开发过程中遇到的问题整理出来跟大家分享.问题1:为什么页面底部不显示tabbar?很多网友(包括我自己)也遇到过此类问题,在app.json里面明明加了tabbar,list里面也加了路径怎么就是不显示呢?举例,如下代码,为什么屏幕页面底部没有如

我们在开始微信小程序开发的时候,对JS,HTML等前端知识一无所知,完完全全就是门外汉在尝试一个新的方向. 在下载好开发工具,微信就已经提供了一个DEMO例子: 从程序开发的角度来看这个陌生的目录结构,pages是存放页面的,utils是存放工具类的,而app开头的三个文件既然放在根目录级别,那么按理讲,应该是和配置有关. 我们看app.js文件的内容: //app.js App({ onLaunch: function () { //调用API从本地缓存中获取数据 var logs = wx.

一个page由一个文件夹以及文件夹下四个文件组成. 比如一个页面叫index.则需要在pages目录下新建一个index目录,且包含由index+类型(js\wxml\wxss\json)为名组成的若干文件.文件名格式为硬性要求. 1.JS部分 1.1概述 Page({ data: { logs: [] }, onLoad: function () { this.setData({ logs: (wx.getStorageSync('logs') || []).map(log => { retu

第一节讲了目录结构,这节主要讲解下目录中app.js部分. 它由三部分组成app.js.app.json与app.wxss 1.JS部分 1.1概述 //app.js App({ onLaunch: function () { // 展示本地存储能力 var logs = wx.getStorageSync('logs') || [] logs.unshift(Date.now()) wx.setStorageSync('logs', logs) // 登录 wx.login({ success

我们先来看一份图,这个设置在官方文档中已经写得很清楚了,我只是做一个总结 注:我写注释是为了方便说明,在小程序中的json文件中是不能用注释的 这个tabBar属于全局属性,因此就在全局配置文件app.json中配置 1.tabBar的配置 "color": "#8a8a8a", "selectedColor": "#f40",//选中的颜色 "backgroundColor": "#ffffff

1.小程序示例源码:https://github.com/wechat-miniprogram/miniprogram-demo 2.微信 weui下载地址:https://github.com/weui/weui-wxss/ weui用微信开发者工具打开步骤. 新先小程序,目录选择dist.appid可以选择测试 对WEUI css详解

1.环境概览 首先环境配置的部分略过,打开小程序开发工具.选择一个空目录,即可开始一个demo项目. 其中新建成功后的目录如图所示: 2.文件结构描述 如图所示,左边是界面展示,右边是目录结构. 目录大体分为3部分:app部分.pages部分.其他部分. app主要放置一些全局性的变量以及配置.就相当于浏览器中的windows.node中的global. pages中放的是一个一个的页面.一个页面由一个文件夹组成,文件夹内由四部分组成,js,wxml,wxss,json. 其中js主要是该页面的

前几天遇到一个朋友求助,实现购物车的相关功能,一时心血来潮,想着抽空搭建一个小程序电商平台(虽然网上有很多,但还是自己撸一遍才是王道),所以在工作之余整了一个仓库,今天提交了第一次代码,已经满足了朋友的需求,后续我会完善其他平台.现在项目里面的数据是我用静态JS模拟的,以后有可能会换其他方式,欢迎志同道合的小伙伴们一起探讨围观,如果觉得对你有所帮助,请不要吝啬你的发财手帮我star或转发一下,谢谢了.下面附上目前的效果:(切图自己抠的,请见谅.)   上项目地址:https://github.c

忘记从哪获得的 CSDN  可以支持一下 谢谢你们 https://download.csdn.net/download/lan1128/10197682 当然也有免费的 代码在码云上免费公开 点个关注呗  谢谢你们 https://gitee.com/lanshengzhong/wechat-mini 么么~~

1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=14764346775993:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源下载5

问题场景 所谓悬浮窗就是图中微信图标的按钮,采用fixed定位,可拖动和点击. 这算是一个比较常见的实现场景了. 为什么要用cover-view做悬浮窗?原生组件出来背锅了~ 最初我做悬浮窗用的不是cover-view,而是view. 这是简化的代码结构: index.wxml: <view class="move-view" style=" top:{{top}}px;left:{{left}}px;" bindtap="goToHome"