Poppy_LYT的博客

在弹窗的最外层div加上属性catchtouchmove=‘true’ // 开发工具看不出来需真机调试

data: { return { socketOpen: false, }},onLoad () { wx.connectSocket({ url: `ws://地址（不包含http）`, success: (res) => { console.log(res, 'connectSocket...

wx.setNavigationBarTitle({ title: 'xxx'})

在想修改的页面的main.json中添加{ "navigationBarBackgroundColor": "#2186F6”, // 标题的背景颜色 "navigationBarTextStyle": "white", // 标题的字体颜色} 若想改变所有页面的标题背景色和字体颜色，在app.json中添加即可...

a页面： 跳转到b页面wx.navigateTo({ url: '../shop-uploadServe/main?type=edit'})b页面：在onLoad的options中接收onLoad (options) { if (options.type == 'edit') { wx.setNavigationBarTitle({ ...

<button class="button-share" open-type="share">点击分享给微信好友</button>onShareAppMessage (e) { return { title: '自定义标题', path: '/pages/home/main', // 好友点击分享之后跳转到的小程序的页面 desc:...

注意：在app.json里直接增加tabBar只是首页的几个页面进行切换才会显示，但是如果想在子页面也显示就需要自定义tabbar组件，在想使用的子页面按下面的方法引入就可以了1、自定义tabBar组件注意：可以新建一个目录叫做components，专门放封装好的组件，注意在tabbar目录里新建Component（组件），而不是新建Page2、tabbar.wxml<view c...

微信小程序—使用font-awesome图标库第一步：去官网下载font-awesome字体包font-awesome官网下载完是一个压缩包，解压之后是这个亚子第二步：找到红线圈出的ttf文件，并上传到这个网址操作如下第三步：convert下载完成之后是一个压缩包，解压之后是这个亚子找到stylesheet.css文件并打开我双击之后默认是hbuilder打开的，无所...

微信小程序—通过onLoad方法中的options获取参数我点击a页面跳转到b页面第一步：在a页面写一个导航，传入一个id值11111<navigator url="/pages/detail/detail?id=1111111" ></navigator>第二步：在b页面的onLoad函数中获取参数onLoad: function (options) { ...

微信小程序—引入页面/组件include、import第一种：我在include页面引入import页面<!-- 引入整个import页面 --><include src="../import/import.wxml" /><text>我是被include页面引入的import页面</text>效果：第二种：引入import页面中...

微信小程序—事件冒泡/阻止事件冒泡（bindtap/catchtap）事件冒泡嵌套关系，每个都有一个类名一个点击事件<view class="view1" bindtap="view1"> view1 <view class="view2" bindtap="view2"> view2 <view class="view3" bindta...

微信小程序—调用豆瓣接口循环出数据展示在页面<view> <view wx:for="{{list}}" wx:key="{{index}}"> <text>{{item.title}}</text> // 因为豆瓣接口给的，我们就是要获取当前获取的每个对象的title值 </view></view&gt...

微信小程序—onLoad和onShowonLoad页面加载完成只执行一次onShow每次进入该页面都执行一次

微信小程序—scroll-view纵向滚动样式设置问题布局样式#home{ width: 100%; height: 100%; position: absolute; top: 0; bottom: 0;}#home scroll-view{ width: 100%; height: 100%;}...

微信小程序—通知栏文字从左到右无限接滚动wxml<view class="marquee_box"> <text class="marquee_text" style="transform: translateX(-{{marqueeDistance}}rpx)" >{{text}}</text> </view&...

微信小程序—scroll-view横向滚动的坑（父级设置flex子集无法一横排显示）

微信小程序—通过dataset获取text的值我的样式是这样的用的for循环写的，给每个text都绑定点击事件和data-text值，就可以检查的时候就会看到currentTarget里的dataset里有一个{text: ‘item值’}，详情请看

微信小程序—自定义嵌套导航效果如下：前情须知：在classify页面里引入组件第一步：在page文件夹新建classify的文件夹和pagewxml<view class="container"> <view class="nav"> <view class="tab-item {{currentTab == 0 ? 'acti...

微信小程序—页面间传值a页面跳转到b页面a页面在跳转时的路径后面加上要传递的参数和值<navigator url="../shop/shop?id=1"> <view>111 </view></navigator>b页面data: { id: '', // 用来储存从a页面获取到的id }, o...

微信小程序—checkbox样式修改效果图：/*checkbox 整体大小 */checkbox{ width: 48rpx; height: 48rpx; border-radius: 50%; border: 10rpx solid #48b0b9; position: relative;}/*checkbox 选项框大小 */ checkbox .wx...

微信小程序—使用全局方法1、在app.js里定义全局方法，例如getData（）方法2、在index.js里使用全局方法getData（）首先获取全局let app = getApp（）；然后app.getData（）就可以使用了。...

微信小程序—for循环包括自定义for循环中的item和index<view wx:for="{{list}}" wx:key="{{index}}"> <text>我是第一个循环的内容---{{item}}</text></view><!-- 自定义for循环的item和index --><view wx:fo...

微信小程序—wx:if隐藏显示第一步：if。wxml<button type="primary" bindtap="toggle">显示/隐藏</button><view wx:if="{{isShow}}"> <text>我是隐藏/显示的内容</text></view>第二步：if。jsdata: { ...

微信小程序—bindtap绑定事件第一步：bindtap。wxml<button type="primary" bindtap="change">更换内容</button><text>{{text}}</text>第一步：bindtap。js data: { text: '我是内容a' }, change: functi...

微信小程序—自定义（城市选择）弹窗组件，并传值1、新建component文件夹用来存放自定义组件，并在其文件夹内新建cityModal Component，注意不是新建Page新建完成之后出现四个和Page一样后缀的文件，只是里面的内容不一样而已2、cityModal.wxml(可直接粘贴)<view class="cityModal" wx:if="{{cityMo...

微信小程序—tabBartabBar官网找代码"tabBar": { "color": "#000", "selectedColor": "#ff0000", "backgroundColor": "#CCC", "list": [ { "pagePath": "pages/index/index", "text":...

微信小程序—生命周期写在app.js里onLaunch:fn // 小程序初始化执行onShow: fn // 页面显示执行onHide: fn 切换后台会执行该函数(当前在操作小程序的时候，突然来了一个电话，中断当前操作，那么就会执行该函数， 如果当前开发的是个小游戏，那么就可以暂停当前游戏进度)刷新后即可看到控制台输出点击切换后台时onHide出现...

微信小程序—修改单个路由页面的配置项如"navigationBarTitleText"直接修改即可，不需要像全局那样写在window对象里

微信小程序—清空input框内的值1、给input的value值绑定一个inputValue的变量给button绑定一个点击事件<input value="{{inputValue}}" placeholder="搜索电影" /><button bindtap="searchFn" type="primary">搜索</button>2、data...

微信小程序—模拟豆瓣搜索电影先新建search目录和page1、在search.wxml页面给input添加bindinput事件给button绑定bindtap事件<view id="container"> <input bindinput="keyWord" class="search" placeholder="搜索电影" /> <view w...

微信小程序—获取input框内的值1、wxml页面：input框内绑定一个bindinput，键盘输入时触发<input bindinput="keyWord" class="search" placeholder="搜索电影" />2、js页面：data: { keyWord: '' },keyWord: function (e) { console...

微信小程序—域名配置1、微信公众平台登录进入后选择‘开发’选择‘开发设置’域名配置，输入easy-mock即可（因为我用的地址就是easy-mock，如果用的是豆瓣接口就直接域名配置成豆瓣的就行）2、打开右上角的详情选择不校验...

微信小程序—路由（wx.navigateTo和wx.redirectTo的区别）1、wx.navigateTo：保留当前页面，跳转到应用内的某个页面用户点击用户中心时，因为用户没有登录跳转到登录页面，左上角有一个返回箭头，点击之后发现会返回到用户中心这一路由，对其进行了保存，所以返回到了用户中心路由，这样是错的，没有登录怎么会跳转到用户中心呢，所以应该用wx.redirectTo2、w...

用wx:for写swiper轮播图新建一个swiper目录=》新建swiperPage1、在swiper.wxmlautoplay=“true” 自动播放interval=“500” 时间间隔circular=“true” 衔接滑动，不然能看到从最后一张图片跳转到第一张的过程<view class="container"> <swiper autoplay...

swiper轮播图图片不显示的解决方法遇到图片无法显示的问题，是样式问题在wxss里面新型修改 设置宽度.container{ width: 750rpx;}.container swiper{ width: 100%;}.container swiper image{ width: 100%;}一定要设置宽度...

这是会发现右下角的调试器有两个警告，其中一个就是解决方法如下：打开project。config。json，在setting下面增加一句话

微信小程序—button的三个type

微信小程序—入门（新建项目和配置项）第一步：左上角新建项目，选择测试号即可第二步：新建项目之后点开app。json选中的部分就是页面显示的顺序，下面的window是整体页面一些样式比如字体什么的第三步：新建页面pages文件夹打开，里面存放的就是页面，先新建一个目录起名为test的文件夹里面在新建Page也起名test，这是test文件夹里面有四个内容wxml是写页面布局...

微信小程序—success回调函数为什么使用this.setData报错在success函数中执行this.setData报错是因为success方法指向闭包，所以this属于闭包，由此在success回调函数里是不能直接使用this.setData()的，如果我们要使用的话，可以在闭包之外先把this赋值给另一个变量。bindViewTap: function() { let s...

微信小程序—上拉加载新建scroll目录=》新建scrollPage1、scroll.wxml<view id="container"> <scroll-view scroll-y="true" // 允许纵向滚动 scroll-top="{{scrollTop}}" // 滚动轴的位置，用于返回顶部 scroll-with-animation=...