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. VMware学习笔记之在虚拟机中使用Ghost系统盘安装xp黑屏卡在光标闪无法进入系统

    使用ghost安装后,无法进入系统,卡在光标闪动,请参考如下: https://www.cnblogs.com/mq0036/p/3588058.html https://wenku.baidu.co ...

  2. C# vb .net实现焦距灰度特效滤镜

    在.net中,如何简单快捷地实现Photoshop滤镜组中的焦距灰度效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第 ...

  3. 深入理解es6(上)

    一.let和const 1.let与var的区别 不存在变量提升 块级作用域 不允许重复声明 2.const常量 const与let一样,唯一区别在于声明的常量不能被修改 二.解构赋值 es6按照一定 ...

  4. 【体系结构】有关Oracle SCN知识点的整理

    [体系结构]有关Oracle SCN知识点的整理 1  BLOG文档结构图   BLOG_Oracle_lhr_Oracle SCN的一点研究.pdf 2  前言部分 2.1  导读和注意事项 各位技 ...

  5. Cannot assign to read only property 'exports' of object '#<Object>' ,文件名大小写问题!!!

    有些坑不知道怎么就掉进去,可能一辈子都爬不起来!!! 一.错误描述 昨天还好好的,今天早上来从git获取了一下别人提交的代码就出错了!而提交代码的人 运行一点错误都没有!!! cya@KQ-101 M ...

  6. vue中引入mui报Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them的错误

    在vue中引入mui的js文件的时候,报如下的错误: 那是因为我们在用webpack打包项目时默认的是严格模式,我们把严格模式去掉就ok了 第一步:npm install babel-plugin-t ...

  7. Java开发环境之Maven

    查看更多Java开发环境配置,请点击<Java开发环境配置大全> 肆章:Maven安装教程 1)下载Maven安装包 https://maven.apache.org/download.c ...

  8. ansible运维工具,dhcp,cobbler

    1.借助Ansible Playbook自动化搭建LNMP环境(可借助yum) 通过yum方式安装ansible,先安装epel仓库 yum install epel-release 安装epel仓库 ...

  9. 进程间通信之数据传输--FIFO

    One of the fundamental features that makes Linux and other Unices useful is the “pipe”. Pipes allow ...

  10. VUE--404页面

    <一 404 动态页面> <!-- 2017/5/26- yyy-404页面--> <template> <section class="page_ ...