[Django+微信小程序开发]02微信小程序视图层

布满荆棘的人生 2023-07-12 05:09 43阅读 0赞

### 小程序视图层 ###

#### 首先我的最终目的是为了开发PythonDjango+微信小程序的校园应用,所以查看我这个系列就可以查看一些有用的内容 ####

#### 数据绑定 ####

*  Jinja2 语法相似 \{ \{数据内容\}\}
 *      <view class="usermotto">
            <text class="user-motto">{
             {motto}}</text>
        </view>

#### 列表渲染 ####

<view wx:key="{ {array}}">    
    No.{
       {index+1}}:{
       {item.message}}
    </view>

#### 条件渲染 ####

<view wx:if="{ {next1 =='code'}}">code wxif中东西需要是单引号</view>
      <view wx:elif="{ {next1 =='next'}}">next</view>
      <view wx:else="{ {next1 =='bbb'}}">bbb</view>

#### 绑定事件 ####

tab 		手指触摸马上离开
    
    longpress 	手指触摸350ms再离开(推荐使用)
    
    longtab 	手指触摸350ms再离开
    
    touchstart 	手指触摸动作开始
    
    touchend 	手指触摸动作结束

wxml
    <view id="tabTest" data-hi="wechat" bindtap="tabName">wechat</view>

js
    tabName:function(event){
        console.log(event)
      },

\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AHNsTgfP-1583543341065)(C:\\Users\\nice\\AppData\\Roaming\\Typora\\typora-user-images\\image-20200214215250049.png)\]

\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-2XKU0UOk-1583543341066)(C:\\Users\\nice\\AppData\\Roaming\\Typora\\typora-user-images\\image-20200214215750067.png)\]