之前由于不了解微信小程序的整个的运行开发机制,走了很多的弯路,脑子灵光的可能不会遇到,这个主题系列的帖子希望可以帮助到像我一样理解能力慢的孩子。

不论是开发微信小程序还是说学习任何一门编程语言,最重要的一点是要夯实基础,不是只是去看看概念,从hello word开始就要好好的去对待每一行代码,软工是工科,工科就要多动手,每一位走的长远的程序员都不会缺少匠心精神。

1.Q:一个appid只能创建一个小程序项目吗?我写毁了怎么办?我把小程序开发者工具自动创建的快速启动模板不小心删掉了怎么办??

A:一个appid是可以用来创建多个本地工程的,如果你在本地创建的工程是一个空的工程(也就是一个空的文件夹)的话,小程序开发者工具将会进行自动识别,在下方会出现默认勾选快速启动模板,或者是云启动模板,当然你也可以选择照着开发文档去撸代码,前者是提高工作效率,后者是巩固自身专业素质。

放几个有用的链接:

微信开放社区:https://developers.weixin.qq.com/community

微信小程序官方开发文档:https://developers.weixin.qq.com/miniprogram/dev/

知乎小程序社区专栏:https://zhuanlan.zhihu.com/wxapp-union

如果说看不懂官方文档(这种情况真的有)当然只是一开始,网上有很多别人理解过后转化成他的理解 并且很形象的文章也很多,简书上很多好的开发者,这里我放一个我很喜欢的CSDN博主的文章:https://blog.csdn.net/aoaoxiexie/article/details/53670236他的教程是最详细的了,我相信你一定可以看得懂,起步完成了,后面的官方文档你一定能看的懂。

做程序员必备的素养是面向谷歌和百度编程,不仅要一开始学会使用搜索引擎快速的找到对我们最有用的信息,对于前端开发者来说,控制台部分也很重要,

Chrome开发者工具中文文档:http://www.css88.com/doc/chrome-devtools/

掘金的前端开发文章很多很精:https://juejin.im/

segmentfault:https://segmentfault.com/(这个社区大佬能力很强且在里面问一些伸手党的问题一定会被隐藏,所以一定要有自己先解决问题,再问其他人的习惯。)

还有就是在公司工作的时候,大家每个人的时间经历都有限,如果你是萌新实习生,想要请教前辈问题可怎么办??

第一点你必须要明确的是,没有人有义务去帮助你,职场不是水浒传,不讲义气,只讲实力。

第二点你要学会怎么问问题,你可能一开始没办法完全表达出来你想问的,那先打个草稿,我想要什么样子的结果,我用什么样的方式去实现了它,结果与预想的哪里不一样,我为了和预想一样我做了什么样的改正,最终没有成功,在这个过程全程要看控制台的部分,小程序和静态页面不同的是,很有可能快速开发模板给你建立了一系列的“现成”的东西,也包括一个全局的样式:app.wxss这个文件你一定要注意,把不需要的样式在开发前就删减掉,以免之后开发过程中出现各种奇怪的诡异页面效果。

与后端沟通的时候,一般是后端为我们前端提供一个https接口,需要我们去请求它并且拿到一个我们想要的数据出来,这个时候后端会告诉你,我需要你前端来给我提供什么样子的数据,我返回给你200OK,以及我返回给你前端你前端需要的数据,这个过程和Ajax是一样的,但是如果你不明白的话,先去上网搜索资源,然后去查找原因,你要用console.log(res.statusCode)来首先看一下请求是否成功,如果成功了接口继续报错,你就要考虑以下你的appid和后端的appid是否一致了。

2.Q:我在util.js里面想写一些适用于全局的函数,但是在其他的页面中去使用util.方法名 却告诉我:Function is not defined 怎么办???

A:这个情况十有八九就是你忘记在moudle.exports这个用来对外暴露接口里忘记进行函数的接口暴露了,你不暴露别人怎么访问的到?? 这也是一个值得注意的地方。

3.如果你的代码结构还不能写的清晰明了,要多加注释,一方面是方便你多年之后的codeReview 就像你看你小时候贼丑的照片一样,更重要的是,你是在一个团队里工作,你需要让别人看懂你的代码,前辈想帮你check的时候,虽然代码写的很恶心,但是有了注释,会降低一些不适感·····

4.写CSS的时候不要死扣用一种方法,不要觉得会了一种方法就哪哪都用,一定要灵活,层级结构要从一开始给你美术图之后就规划正确。以及要多与你的产品经理进行沟通。

5.如果我们的项目需要写一个海报分享功能怎么办?

网上的 几乎教程都是用canvas标签来画,这是正确的路子,但是你如果是新手,数学还不是很好,canvas就会降低工作效率了,这个时候你的解决办法是:用HTML写出一个静态页面给到后端,后端把你的数据进行绑定,也就是把数据变活(每天的海报都不一样的情况),这个时候你就用他给你的图片链接接口去做保存到相册的逻辑,与此同时,你在前端把分享图用css写出来,这个目的是为了提高用户的使用感受,加载的时候会很快。

微信小程序前端开发踩坑(一)的更多相关文章

  1. mpvue实现微信小程序(欢迎踩坑)

    最近刚使用mpvue完成了微信小程序的开发,写点东西,做个记录. 首先依旧是两个传送门: 微信小程序文档:[https://developers.weixin.qq.com/miniprogram/d ...

  2. 微信小程序Map组件踩坑日记

    刚刚又发生一个bug,搞得我头皮发麻,本来该美滋滋的回家准备度过愉快的周末,瞬间变成了日常修bug,来,开始填坑之路 情景再现: 首先说一说我们项目的需求, 点击下方,弹出抽屉 点击对应的地图打开相应 ...

  3. 小程序语音红包开发中 汉字转拼音的问题 微信小程序红包开发遇到的坑

    公司最近在开发微信小程序的红包功能,语音红包需要用到文字转拼音的功能. 之前介绍过怎么将中文的汉字转为拼音的,具体看下面这篇文章. 微信语音红包小程序开发如何提高精准度 红包小程序语音识别精准度 微信 ...

  4. 微信小程序-卡券开发(前端)

    刚完成一个微信小程序卡券开发的项目.下面记录开发前,自己困惑的几个问题. 因为我只负责了前端.所以下面主要是前端的工作. 项目概述:按照设计图开发好首页上的优惠券列表,点击某个优惠券,输入手机号,点击 ...

  5. 微信小程序的开发:通过微信小程序看前端

    前言 2016年9月22日凌晨,微信官方通过"微信公开课"公众号发布了关于微信小程序(微信应用号)的内测通知.整个朋友圈瞬间便像炸开了锅似的,各种揣测.介绍性文章在一夜里诞生.而真 ...

  6. 微信小程序红包开发 小程序发红包 开发过程中遇到的坑 微信小程序红包接口的

    微信小程序红包开发 小程序发红包 开发过程中遇到的坑 微信小程序红包接口的   最近公司在开发一个小程序红包系统,客户抢到红包需要提现.也就是通过小程序来给用户发红包. 小程序如何来发红包呢?于是我想 ...

  7. 微信小程序,前端大梦想(二)

    微信小程序的视图与渲染  今天我们从四个方面来了解小程序:   •组件的基本使用  •数据绑定  •渲染标签  •模板的使用     一.组件的基本使用:  微信小程序为我们的开发提供了丰富的UI组件 ...

  8. 微信小程序快速开发

    微信小程序快速开发 一.注册小程序账号,下载IDE 1.官网注册https://mp.weixin.qq.com/,并下载IDE. 2.官方文档一向都是最好的学习资料. 注意:1)注册账号之后会有一个 ...

  9. 微信小程序从零开始开发步骤(八)引入框架WeUI

    首先来看下WeUI的官方介绍: WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一.在微信小程序的开发过程中,涉及到的前端 ...

随机推荐

  1. Flask Vue.js全栈开发

    Flask Vue.js全栈开发的 最新完整代码 及使用方式 本系列的最新代码及使用方式将持续更新到: http://www.madmalls.com/blog/post/latest-code/ 1 ...

  2. 初识ldap

    什么是LDAP? LDAP的英文全称是Lightweight Directory Access Protocol,一般都简称为LDAP.它是基于X.500标准的, 但是简单多了并且可以根据需要定制.与 ...

  3. XJ模拟noip赛1

    什么都不说—— 成功打出 G-G!

  4. vue整理

    安装 vue ui axios import axios from 'axios' // let curWwwPath = window.document.location.href // let p ...

  5. 跟随我在oracle学习php(11)

    数组专题 数组遍历: 1,普通for循环,经常用的数组遍历 var arr = [1,2,0,3,9]; for ( var i = 0; i <arr.length; i++){ consol ...

  6. echarts 去掉 x轴坐标

    symbol:'none', //这句就是去掉点的 smooth:true,

  7. win10电脑安装win7

    1.进入BIOS,关闭“Secure Boot”功能,启用传统的“Legacy Boot”.预装WIN8的系统想要更换WIN7系统首先需要修改BIOS设置.BIOS设置方法:F2进入BIOS,选择se ...

  8. day45-python实例练习

    '''ABCD * 9 = DCBA 通过计算机的方法,给我们计算出 A= ? B = ? C = ? D =? A; 1-9 B: 1-9 C: 1-9 D; 1-9 A != B != C != ...

  9. 动态规划Dynamic Programming

    动态规划Dynamic Programming code教你做人:DP其实不算是一种算法,而是一种思想/思路,分阶段决策的思路 理解动态规划: 递归与动态规划的联系与区别 -> 记忆化搜索 -& ...

  10. SQL-57 使用含有关键字exists查找未分配具体部门的员工的所有信息。

    题目描述 使用含有关键字exists查找未分配具体部门的员工的所有信息.CREATE TABLE `employees` (`emp_no` int(11) NOT NULL,`birth_date` ...