微信小程序·前端-锦囊

 
 
1.列表追加数据

getSupplierList(){
const that = this const params = { list_rows: that.data.list_rows, page: that.data.page, supplier_name: that.data.supplier_name } console.log('获取所有公司列表') home_model.getSupplierList((res)=>{ console.log(res.data.data) console.log('长度为:'+res.data.data.length) if (res.data.data.length === 0) { that.setData({ isDataMoreStatus: false, load_type_name: '已显示全部' }) } // const listData = this.data.getSupplierList.concat(res.data.data) that.setData({ getSupplierList: listData }) },params) },

 

 
 
==========================
flex【盒子】
 
display: flex;
flex-direction: column;  【从上到下排列】↓
 
justify-content: center;   【距上方  和距下边 ——  距离一致】
 
align-items: center;    【距左+距右——  距离一致】
 
opacity: 0.8;        【不透明度】
 
 
 
flex-direction: row;
vertical-align: middle;

 

==========================
 
 
数组:
console.log(postData.postList);
 
wx.setStorageSync('key', "这是缓存")
【不能超过10MB】
//清除所有缓存
wx.clearStorageSync()
wx.removeStorageSync('key')
 
 格式化代码:alt+shift+f
脚本文件运行,不运行的
<import src="post-item/post-item-template.wxml" />
注意最后的【/】(结尾符合)
引入文件
css;
@import "post-item/post-item-template.wxss";
 
var postData = require('../../../data/post-data.js')
{{...item}}" />    ...为展开
======================================================
判断使用三元表达式:
 
<image class='audio' catchtap='onMusicTap' src="{{isPlayingMusic?'https://myphp.vip/img/wx/music/music-stop.png':'https://myphp.vip/img/wx/music/music-start.png'}}"></image>

<!-- <image wx:if="{{isPlayingMusic}}" class='audio' catchtap='onMusicTap' src="https://myphp.vip/img/wx/music/music-start.png"></image> -->
<!-- <image wx:else="{{isPlayingMusic}}" class='audio' catchtap='onMusicTap' src="https://myphp.vip/img/wx/music/music-stop.png"></image> -->
 
 --------------
大【target】和【currentTarget】
target指的是当前点击的组件     和 currentTarget 指的是时间捕获的组件
target这里只的是image,而currentTarget 指的是swiper
 
 
onBannerTap:function(event)
{
console.log(event);

var postId = event.currentTarget.dataset.postid;      ()
wx.navigateTo({
  url: "post-detail/post-detail?id=" + postId
})
}
 
 
 
======================================================
命名规范:
date:
title
imgSrc
avatar:
content:
reading:
collection
 
 
 
 
 
 
 
 
 
=======================================================
<!-- Banner轮播图 start -->
<view>
<swiper autoplay="true" indicator-dots="true" circular='true' interval="1500" >
<swiper-item>
<image src='{{muke.image1}}'></image>
</swiper-item>

<swiper-item>
<image src='{{muke.image2}}'></image>
</swiper-item>

<swiper-item>
<image src='{{muke.image3}}'></image>
</swiper-item>
</swiper>
</view>
<!-- Banner轮播图 end -->
 
<block wx:for="{{post_key}}" wx:for-item="item" wx:for-index="ids">
{{ids}}  为索引
{{item}}  为值
{{item.image}}
</block>
 
 
 
<view>
<View style="width:100%">
<text style='color:red;margin-left:150rpx;'>
【柴静雾霾调查:穹顶之下(完整版)】
</text>
</View>
<view >
<video style="width: 100%;height=400px;margin:1px;" src="{{video}}" binderror="videoErrorCallback"></video>
</view>
</view>
----------------------------
this.setData({
post_key:post_content
}),
 
 
template模板:
 
 
<!-- 新闻内容 start -->
<block wx:for="{{postList}}" wx:for-item="item" wx:for-index="ids">
<template is="postItem" data="{{...item}}" />
</block>
<!-- 新闻内容 end -->
 
posted @ 2018-12-25 23:40  林间有风-邓  阅读(299)  评论(0编辑  收藏  举报