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. ubuntu中安装python3和pip

    python3: 在ubuntu的包中,python的二代和三代版本的命名:二代:python,三代:python3 安装python3: sudo apt install python3 同理:pi ...

  2. 2019 4399java面试笔试题 (含面试题解析)

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

  3. 学习网络BGP必备基础知识

    外部网关协议,使用TCP作为传输层协议,支持CIDR,增量更新,距离矢量路由协议,无环路,路由策略丰富,可防止路由震荡,易于扩展. BGP概述 #BGP工作原理 之 报文类型 TCP三次握手 open ...

  4. npm全局模块卸载及默认安装目录修改方法

    卸载全局安装模块  npm uninstall -g <package> 卸载后,你可以到 /node_modules/ 目录下查看包是否还存在,或者使用以下命令查看:npm ls npm ...

  5. 在vue组件中访问vuex模块中的getters/action/state

    store的结构: city模块: 在各模块使用了命名空间的情况下,即 namespaced: true 时: 组件中访问模块里的state 传统方法: this.$store.state['模块名' ...

  6. 复盘一篇浅谈KNN的文章

    认识-什么是KNN KNN 即 K-nearest neighbors, 是一个hello world级别, 但被广泛使用的机器学习算法, 中文叫K近邻算法, 是一种基本的分类和回归方法. KNN既可 ...

  7. React: 无状态组件生成真实DOM结点

    在上一篇文章中,我们总结并模拟了 JSX 生成真实 DOM 结点的过程,今天接着来介绍一下无状态组件的生成过程. 先以下面一段简单的代码举例: const Greeting = function ({ ...

  8. Oracle数据库插入过程中特殊符号

    -- 问题描述:(插入数据中有特殊符号)数据插入后乱码. -- 背景:客户提供部分Excel表格数据要求导入数据库.由于考虑到数据量不大所以粗略在Excel中进行了sql处理(在数据前后添加sql及对 ...

  9. 自定义View(二),强大的Canvas

    本文转自:http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2012/1212/703.html Android中使用图形处理引擎,2D部分是 ...

  10. angularcli 第八篇(router 路由)

    更多详细:https://segmentfault.com/a/1190000009265310 一.标题:页面有两个按钮(test1.test2),点击这两个按钮,跳转相应页面~ 注:可直接创建一个 ...