VSCode

Node.js

HbuilderX

安装前端开发环境

[外链图片转存失败(img-aXUJRfXc-1565136341881)(https://upload-images.jianshu.io/upload_images/11158618-d95bdf80673bd914.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

npm install -g cnpm
--registry=https://registry.npm.taobao.org
cnpm install -g less

[外链图片转存失败(img-9ulpolqR-1565136341883)(https://upload-images.jianshu.io/upload_images/11158618-96874e99fbe2e6fd.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

HBuilderX是国内最优秀的前端开发工具,我们用它来开发Electron项目和小程序项目

[外链图片转存失败(img-QjN6oJgS-1565136341889)(https://upload-images.jianshu.io/upload_images/11158618-9e5096ce67456ee4.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-es53UUtf-1565136341894)(https://upload-images.jianshu.io/upload_images/11158618-50ab575c6df120ee.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-p7K2vAuH-1565136341897)(https://upload-images.jianshu.io/upload_images/11158618-2aac4cf757f76947.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-hetLhOcR-1565136341902)(https://upload-images.jianshu.io/upload_images/11158618-ef8b8beb69455e79.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-nCI0JQ1o-1565136341907)(https://upload-images.jianshu.io/upload_images/11158618-94ea7e0bead0c8db.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-hNcVkWrk-1565136341910)(https://upload-images.jianshu.io/upload_images/11158618-afe5d0ebee2f5be8.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-3Vtruoao-1565136341915)(https://upload-images.jianshu.io/upload_images/11158618-cbbc4c81d44090ee.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

{
"pages": [
"pages/index/index"
],
"requiredBackgroundModes": [
"audio",
"location"
],
"subPackages": [],
"window": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "我喜欢你",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"usingComponents": {}
}
@import './common/main.wxss';
require('./common/runtime.js')
require('./common/vendor.js')
require('./common/main.js')
.content {
padding: 0 40rpx;
}
.content image {
width: 100%;
}
.content .title {
display: block;
text-align: center;
font-size: 50rpx;
font-weight: bold;
}
.content .operate {
text-align: center;
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.content .operate .btn {
width: 200rpx;
height: 80rpx;
display: inline-block;
}
.content .operate .btn:first-of-type {
margin-right: 40rpx;
}
.content .message {
font-size: 34rpx;
margin: 15rpx 0;
color: #333;
}
<view class="content"><image src="../../static/g1.gif" mode="widthFix"></image><text class="title">小姐姐,做我女朋友吧!</text><view class="operate"><button class="btn" type="primary" data-event-opts="{{[['tap',[['agree',['$event']]]]]}}" bindtap="__e">好呀</button><button class="btn" type="warn" data-event-opts="{{[['tap',[['disagree',['$event']]]]]}}" bindtap="__e">不好</button></view><block wx:for="{{love}}" wx:for-item="one" wx:for-index="__i0__" wx:key="*this"><view class="message">{{one}}</view></block></view>

若本号内容有做得不到位的地方(比如:涉及版权或其他问题),请及时联系我们进行整改即可,会在第一时间进行处理。


请点赞!因为你们的赞同/鼓励是我写作的最大动力!

欢迎关注达叔小生的简书!

这是一个有质量,有态度的博客

[外链图片转存失败(img-W55HepdX-1565136341917)(https://upload-images.jianshu.io/upload_images/11158618-9ab0d3fef85d80ce?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

微信小程序七夕节礼物的更多相关文章

  1. 微信小程序 教程及示例

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有,转载请联系作者获得授权.微信小程序正式公测, ...

  2. 微信小程序资料集合

    一:官方地址集合: 1:官方工具:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=1476434678461 2: ...

  3. 微信小程序开发学习资料

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  4. 微信小程序学习指南

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  5. 微信小程序购物商城系统开发系列-目录结构

    上一篇我们简单介绍了一下微信小程序的IDE(微信小程序购物商城系统开发系列-工具篇),相信大家都已经蠢蠢欲试建立一个自己的小程序,去完成一个独立的商城网站. 先别着急我们一步步来,先尝试下写一个自己的 ...

  6. 微信小程序--火车票查询

    微信小程序--火车票查询 写在最前面 微信小程序自九月份推出内测资格以来,经历了舆论热潮到现在看似冷清,但并不意味着大家不那么关注或者不关注了.我想不管是否有内测资格,只要是感兴趣的开发者已经进入潜心 ...

  7. 微信小程序(应用号)资源汇总整理

    微信小应用资源汇总整理 开源项目 WeApp - 微信小程序版的微信 wechat-weapp-redux-todos - 微信小程序集成Redux实现的Todo list wechat-weapp- ...

  8. 微信小程序开发初体验--教你开发小程序

    微信小程序 微信小程序面世以来受到的关注颇多,直到最近我才动手尝试进行了小程序的开发,总体上感觉还是不错的,有一点不适应的就是要摆脱Web APP开发对DOM的操作.在这里我就把我是如何利用API开发 ...

  9. 02月刊(上) | 微信小程序

    * { margin: 0; padding: 0 } .con { width: 802px; margin: 0 auto; text-align: center; position: inher ...

随机推荐

  1. 切换GCC编译器版本

    当前版本信息 root@ubuntu:runninglinuxkernel_4.0# aarch64-linux-gnu-gcc -v Using built-in specs. COLLECT_GC ...

  2. Windows 7 下安装 docker

    Windows 7 下需要安装docker toolbox即可(里面打包了docker.oracle virtualbox.Git) 1. 下载 1. 下载路径https://github.com/d ...

  3. 执行kubectl create-f replicaset.yaml后k8s是如何工作的

    参考:提高 kubectl 使用生产力[译] 英文原文:https://learnk8s.io/blog/kubectl-productivity/ Kubernetes 架构 Kubernetes ...

  4. 2019 网宿科技java面试笔试题 (含面试题解析)

    本人3年开发经验.18年年底开始跑路找工作,在互联网寒冬下成功拿到阿里巴巴.今日头条.网宿科技等公司offer,岗位是Java后端开发,最终选择去了网宿科技. 面试了很多家公司,感觉大部分公司考察的点 ...

  5. php数组的数学功能相关常用函数

    php数组中有一些函数与数学相关的函数,大多都是以array开头然后下划线接一个数学上的英文单词,如下: array_diff() array_diff_assoc() array_intersect ...

  6. Mac android studio真机调试步骤

    Mac android studio真机调试步骤 这些步骤是在百度中查找的,当时记录下来了,过了个把月了,今天写出来,我也重温步骤. 1.找到android的SDK路径,一般是 /user/你的电脑名 ...

  7. react学习记录(一)

    一.React是什么 声明式写法(强调结果,命令式编程强调过程) 组件化 一次学习,随处编写(多种应用场景,web程序,原生手机应用,系统应用,命令行工具) 二.为什么学习react 大公司加持-fa ...

  8. JavaScript之控制标签css

    控制标签css标签.style.样式='样式具体的值'如果样式出现中横线,如border-radius,将中横线去掉,中横线后面的单词首字母大写,写成borderRadius如果原来就要该样式,表示修 ...

  9. Sublime Text3的安装(package control error 或者 there are no package available for installation等问题)

    Sublime是一款非常好用的代码编辑器.Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,多种语言的插件,代码段等.还可自定义键绑定,菜单和工具栏.Sublime Text 的 ...

  10. Linux Samba服务器的安装

    Samba最大的功能就是可以用于Linux与windows系统直接的文件共享和打印共享,也可以用于Linux与Linux之间的资源共享 安装 # yum install samba samba-cli ...