==========================
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 -->
- mysql的数据现实在小程序_使用phpstudy将本地mysql数据显示在微信小程序前端
使用phpstudy将本地mysql数据显示在微信小程序前端 第一步:新建小程序 在pages文件里新建一个phptest文件夹,如果你不知道操作,建议先学小程序的基础知识 第二步:写phptest. ...
- 微信小程序——前端——抵扣券、优惠券样式
微信小程序--前端--抵扣券.优惠券样式 效果图: 实现思路: 左边+划线+右边==使用信息+分割线+使用限制 整体底色: .wrapper {margin: 0 auto;width: 100%;d ...
- 微信小程序前端RSA加解密
开门见山地说,希望各位前端不要搜到这篇文章,因为我总感觉在小程序端去做RSA的加解密总有种脱了裤子放屁多此一举的感觉.但是需求来的时候总是说不准的,接下来我就给大家推荐一种在小程序端比较方便,操作不 ...
- (已更新）运势运程小程序v1.2.0 功能模块+微信小程序+前端+后端+新增每日星座卡片
运势运程算命小程序 v1.2.0 完整版+微信小程序+前端+后端 运势运程算命小程序开源源码最新更新日志: 新增测算栏目支付成功模版消息提醒,增加留存率.新增每日星座卡片.单向历,请求缓存解决请求慢问 ...
- 运势运程算命小程序v1.2.0 功能模块+微信小程序+前端+后端+新增每日星座卡片
运势运程算命小程序开源源码最新更新日志: 新增测算栏目支付成功模版消息提醒,增加留存率.新增每日星座卡片.单向历,请求缓存解决请求慢问题.修复测算出生日期开始时间,从 1979 更改为 1918 运势 ...
- 0基础跟着黑马程序员学微信小程序前端开发Day01
学习目录 一.项目的基本组成结构 二.小程序页面的组成部分 三.创建小程序页面 四.小程序的一些组件 1.常用视图容器类组件 2.常用基础内容组件 3.button 按钮的基本使用 4.image 组 ...
- 最新超火毒鸡汤词汇类的微信小程序前端源码
源码介绍: 一款鸡汤类词汇的小程序源码,缺点是没有后台,只有一个前端. 修改说明: app.json文件底部修改小程序APPID index/index.json文件修改小程序名称 接口地址为:htt ...
- WeApp-Workflow：基于Gulp 的“微信小程序”前端开发工作流
WeApp-Workflow 是我在开发个人微信小程序DeveWork+ 过程中积累总结而来的一个基于Gulp4 的,专门用于开发微信小程序的前端开发工作流.旨在通过自动化的方式解决微信小程序开发过程 ...
- 微信小程序框架——微信小程序前端开发工具
微信小程序框架 框架 小程序开发框架的目标是通过尽可能简单.高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务. 框架提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 Java ...
