功能概述
Open-Shop小程序商城,包括:分销(支持三级)、团购(拼多多模式)、秒杀、优惠券、等功能,前后端全部开源。做全网最开源、最稳定、功能做强大的开源小程序商城。
使用说明
建议开发者使用以下环境,这样避免版本带来的问题
https://gitee.com/old-peanut/wechat_applet__open_source.git
秘籍
准备工作
就不多说了,没有内测码去下载个破解版吧
JavaScrip还是要看看的 HTML+CSS 大概知道是干啥的就行
在根目录下用app来命名的这四中类型的文件,就是程序入口文件。
必须要有这个文件,如果没有这个文件,IDE会报错,因为微信框架把这个作为配置文件入口,你只需创建这个文件,里面写个大括号就行 以后我们会在这里对整个小程序的全局配置。记录了页面组成,配置小程序的窗口 背景色,配置导航条样式,配置默认标题。
必须要有这个文件,没有也是会报错!但是这个文件创建一下就行 什么都不需要写以后我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。
这个文件不是必须的。因为它只是个全局CSS样式文件
这个也不是必须的,而且这个并不是指主界面哦~因为小程序的主页面是靠在JSON文件中配置来决定的
有了这两个文件你运行程序,IDE就不会报错了,也意味着这是最简单的微信小程序
Hello World
app.js文件管理整个程序的生命周期,所以在里面添加如下代码:
App({
onLaunch: function () {
console.log('App Launch')
},
onShow: function () {
console.log('App Show')
},
onHide: function () {
console.log('App Hide')
}
})
具体API解释如下
json文件负责配置ActionBar颜色,我们只需要在里面添加如下代码即可,下图有参数说明!
{
"window":{
"navigationBarBackgroundColor": "#BBDEF8",
"navigationBarTitleText": "Demo",
"navigationBarTextStyle":"white"
}
}
美化页面我们用到了 wxml 和 wxss文件 为了程序代码结构简洁我们需要在跟目录下创建一个新文件夹 名字随意,我们这里叫pages然后在pages文件夹里再创建新文件夹 名字随意 这里我们叫 index然后我们创建index.wxml文件然后在里面写入以下代码
<view>
<text class="window">Hello</text>
</view>
然后创建index.wxss文件然后在里面写入以下代码
.window{
color=#4995fa;
}
然后我们创建 index.js文件
在文件中输入如下代码(输入Page IDE会有提示)
Page({
data:{
// text:"这是一个页面"
},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
},
onReady:function(){
// 页面渲染完成
},
onShow:function(){
// 页面显示
},
onHide:function(){
// 页面隐藏
},
onUnload:function(){
// 页面关闭
}
})
函数解释如下:
Json文件负责配置页面路径所以我们在里面加入如下代码 其中index的含义 其实就是指index.js文件这里需要说明一点 pages 里面的路径其实是指向js文件的如果一个目录下没有该名称的js文件是会报错的!
"pages":[
"pages/index/index"
],
完成了!我们来运行程序!
声明
【写著说明】以上内容分享给喜欢编程,有梦想的程序员们,希望能够帮助到你们。以上文章属于此公众号原创所有,如需转载请注明出处。
【免责申明】本公众平台不是广告商,也没有为其他三方网站或者个人做广告宣传。此分享的源代码和文章是小编在项目中、学习中整理的一些认为不错的项目。用户产生的一些自愿下载或者付费行为。与平台没有直接关系