微信小程序细节
微信小程序开发几个细节:
1.界面传值
①全局参数传值
<!--结果-->
<view wx:for="{{data}}" class="case pr">
<image class="pic" src="http://www.jinhuang.com{{item.Thumbnails}}" mode="aspectFill" data-Type="{{item.Type}}" data-Style="{{item.Style}}" data-Area="{{item.Area}}" data-gid="{{item.ID}}" data-src="http://www.jinhuang.com{{item.Thumbnails}}" bindtap="goToDetaile"></image>
<view class="title ellipsis">{{item.Title}}</view>
<view class="tag ellipsis">{{item.Type}} | {{item.Area}} | {{item.Style}}</view>
<view class="headPic pa" bindtap="goToDesigner" data-did="{{item.ID}}">
<image src="{{item.ID}}"></image>
<text class="ellipsis tc"></text>
</view>
</view> 通过绑定触发事件到:goToDetaile var app=getApp();
//跳转案例详情
goToDetaile:function(event){
app.globalData.caseId =event.currentTarget.dataset.gid;
app.globalData.data = event.currentTarget.dataset;
wx.navigateTo({
url: '../detaile/detaile'
});
},
②界面传值
<view class="item-view" wx:for="{{videoDataList}}" wx:for-item="item" wx:key="item.ID">
<navigator url="detaile/detaile?id={{item.ID}}">
<template is="mainTabCell" data="{{item}}" />
</navigator>
</view>
跳转到详情页面:
在触发OnLoad事件时候传入options值
onLoad: function (options) {
//初始化数据
this.getData(options);
},
//加载数据
getData: function (callback) {
var self = this;
wx.showToast({
title: '加载中...',
icon: 'loading',
duration: 10000
});
wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) {
WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}
})
},
2.请求数据
wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) {
WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}
3.全局值使用,当前页面值使用
app.globalData.caseId =event.currentTarget.dataset.gid;
4.HTML数据展示
<import src="../../../wxParse/wxParse.wxml" /> <view class="detaile bg_f mt35 border_t border_b">
<view class="content w mt40 border_t">
<view class="wxParse">
<template is="wxParse" data="{{wxParseData:article.nodes}}" />
</view> </view>
</view> onLoad: function (options) {
//初始化数据
this.getData(options);
},
//加载数据
getData: function (callback) {
var self = this;
wx.showToast({
title: '加载中...',
icon: 'loading',
duration: 10000
});
wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) { WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}
})
},
载入js,转换文本内容成json格式,在展示层通过模板绑定数据。
5.https,ssl2.0问题解决
https:https://www.pianyissl.com/ 免费3个月https证书,在iis中导入证书绑定即可。
ssl2.0 :下载 tls 1.2.reg ,直接电脑双击使用
6.关于MVVM模式研究(开元装饰demo)
微信小程序细节的更多相关文章
- 微信小程序资源整理
微信小程序相关的文档.教程.开源项目等资源的整理,以便于开发学习使用. —— —— 收录仅作个人学习使用,涉及侵权行为及时联系: maple_6392@163.com 项目地址:GitHub | 码云 ...
- 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app
微信官方已经开放微信小程序的官方文档和开发者工具.前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程, ...
- 微信小程序教程汇总
目前市面上在内测期间出来的一些实战类教程还是很不错的,主要还是去快速学习小程序开发的整体流程,一个组件一个组件的讲的很可能微信小程序一升级,这个组件就变了,事实本就如此,谁让现在是内测呢.我们不怕,下 ...
- 微信小程序常见问题集合(长期更新)
最新更新: 新手跳坑系列:推荐阅读:<二十四>request:fail错误(含https解决方案)(真机预览问题 跳坑指南<七十>如何让微信小程序服务类目审核通过 跳坑六十九: ...
- 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...
- 浅谈微信小程序对于创业者,意味着什么?
尽管这个话题,有点儿烂大街,然而作为开发者兼创业人,兹以为很有必要为自己梳理一番. 多年前,当萌生创业的念头时,我是这样在脑海里绘制这幅蓝图的: 我需要一个域名,一个服务器,并且备了案. 我需要至少一 ...
- 微信小程序(应用号)资源汇总整理
微信小应用资源汇总整理 开源项目 WeApp - 微信小程序版的微信 wechat-weapp-redux-todos - 微信小程序集成Redux实现的Todo list wechat-weapp- ...
- 国内首个微信小程序开发者社区www.mntuku.cn
微信小程序开发者社区-微信小程序开发教程-微信小程序最新资讯 - www.mntuku.cn .本站作为专业的微信小程序开发者社区为大家提供:微信小程序开发者交流平台,微信小程序开发教程,微信小程序定 ...
- 微信小程序(应用号)开发资源汇总整理 - 一直更新中
开源项目 wechat-weapp-gank - 微信小程序版Gank客户端 wechat-dribbble - 微信小程序-Dribbble wechatApp-demo - 微信小程序 DEMO ...
随机推荐
- Asp.net Core认证和授权:Cookie认证
关于asp.net core 的文章,博客园已经有很多大牛写过了. 这里我只是记录下自己在学习中的点滴和一些不懂的地方 Cookie一般是用户网站授权,当用户访问需要授权(authorization) ...
- 数据加密之MD5加密
MD5是一个安全的散列算法,有两个特点:1.输入两个不同的明文(一段原始的数字信息)不会得到相同的输出值2.根据输出值,不能得到原始的明文,即过程不可逆所以要解密MD5没有现成的算法,只能用穷举法,把 ...
- 39.css3----button按钮点击时出现蓝色边框
css控制Button 按钮的点击时候出现蓝色边框http://www.inbeijing.org/archives/1139 Button 按钮的点击时候出现蓝色边框的问题 添加css属性,这样在点 ...
- div上下左右居中方法
方法一:在浏览器中只有一个div的情况 { position:fixed; position:fixed; ; ; ; ; margin:auto; } 方法一 方法二:一个父元素div和一个已知宽度 ...
- Web Audio初步介绍和实践
Web Audio还是一个比较新的JavaScript API,它和HTML5中的<audio>是不同的,简单来说,<audio>标签是为了能在网页中嵌入音频文件,和播放器一样 ...
- JS实例4
根据当前年的前五年后五年的年月日 <select id="nian" onclick="Bian()"></select>年 <s ...
- github上删除一个项目或者reposity
1,点击github的头像,选择如下操作. 2.选择要删除的reposity 3.选择settings 4.复制reposity名字,然后下滑鼠标到底部,选择delete this reposity ...
- strlen实现
1.strlen函数. 普通版实现方法, int strlen( char *s) { int length = 0; while(*s++) length++; return length; } 优 ...
- HighCharts学习笔记(一)
HighChars基本概述 Highcharts是一个纯js写成的插件库,很好的外观表现可以满足任何图标需求. 开始使用chart之前进行配置 全局配置: Highcharts.setOptions( ...
- php-fpm慢日志配置
upstream timed out (110: Connection timed out) while reading response header from upstream Nginx报错日志 ...