<image
src="/images/aaa.png"
>
image
>
2.文字標籤:
<text
>hello
text
>
3.swiper滑動輪播:
<swiper
catchtap
="onswipertap"
vertical
="}"
indicator-dots
="true"
autoplay
="true"
interval
="5000"
>
<
swiper-item
>
<
image
id="7"
src="/images/wx.png"
data-postid
="3"
>
image
>
swiper-item
>
<
swiper-item
>
<
image
src="/images/vr.png"
data-postid
="4"
>
image
>
swiper-item
>
<
swiper-item
>
<
image
src="/images/iqiyi.png"
data-postid
="5"
>
image
>
swiper-item
>
swiper
>
單擊事件
onswipertap: function(event) )
}
4.wx:if:
控制顯示隱藏
<image
wx:if
="}"
src="/images/wx.png"
>
image
>
5.wx:for
迴圈遍歷
<block
wx:for
="}"
wx:for-item
="item"
wx:for-index
="idx"
>
block
>
6.單擊事件:
<view
bindtap
="sayhello"
>
view
>
sayhello:function()
7.頁面跳**
有父子關係(最多5級)
wx:n**igateto();
平行跳轉
wx:redirectto();
8.在乙個js中讀取另乙個js中的資料:
在乙個js中建立並輸出本地資料
module.exports=
在另乙個js中引用並獲取資料
var postsdata=require('../../data/posts-data.js')
使用資料
this.setdata();
9.template模板:
建立並定義template
<template
name
='postitem'
>
template
>
在需要的wxml中引用
<import
src='post-item/post-item-template.wxml'
/>
在wxss中引用樣式
@import 'post-item/post-item-template.wxss';
使用template並新增單擊事件
<block
wx:for
="}"
wx:for-item
="item"
>
<
view
catchtap
='onposttap'
data-postid
='}'
>
<
template
is='postitem'
data
='}'
/>
view
>
block
>
var postid =event.currenttarget.dataset.postid;
template傳遞資料的另一種方式
<template
is="starstemplate"
data
="}"
/>
onload:function(option)
11.小程式快取:
快取普通文字
wx.setstoragesync('key', "hello man");
快取物件
wx.setstoragesync('key', );
獲取快取
var name=wx.getstoragesync('key');
刪除快取
wx.removestoragesync('key');
清除所有快取
wx.clearstoragesync();
非同步快取
getpostscollectedasy: function() })
}
wx.showtoast()
13.showactionsheet:
onsharetap: function(event)
})}
14.全域性變數的與獲取:
globaldata:
})獲取
<image
wx:if
="}"
catchtap
='oncolletiontap'
src="/images/icon/collection.png"
>
image
>
<
image
wx:else catchtap
='oncolletiontap'
src="/images/icon/collection-anti.png"
>
image
>
<image
class
='audio'
src="}"
>
image
>
微信小程式常用樣式彙總
小程式特點 用完即走 低頻使用 效能要求低,不支援webview text 2.設定彈性盒子模型 container 3.設定頁面全屏樣式及背景色 page window 5.頁面設定導航條顏色和標題 json 6.設定字型屬性 user name 7.建立圓角矩形邊框 moto container...
微信小程式問題彙總
每個頁面的檔案都要在.js檔案中加上page 官方文件如下 wx.request header success function res 原因是開發工具公升級後,請求的header的content type寫法變了,改成 json 即可。參考 電影詳情介面api為 這裡的id為每部電影所對應的id,...
微信小程式設定控制項權重
1.橫向水平布局 實現水平布局,需要四個view容器元件,其中乙個是父容器。如下 box1 box2 box3 給父容器以下樣式 1 index.wxss 2 content其中display flex將view設定為彈性布局,flex direction row 設定布局的方向是橫向水平布局。在三...