E企盈营销工具技术服务商 热线:4006-838-530

微信小程序开发规范文档(非唯一)

E企盈直播平台营销卖货系统

目录规范 1.目录概述 组件文件所有组件相关文件统一放在components目录下。 图片文件项目图片文件放置于根目录的images文件夹下,组件独有的图片放在当前组件images目录下 模型文件模型文件主要用于编写各类业务模型。项目模型文件放置于根目录的models文件夹下,组件相关模型放置于components目录下的models文件夹中。  行为文件行为文件放在所引用的组件目录下。  WXML规范 1.     WXML规范wxml标签可以单独出现的情况,尽量单独出现,如<input />。<input />控制每行HTML的代码数量在50个字符以内,方便阅读浏览,多余的代码进行换行处理,标签所带属性每个属性间进行换行。<v-music  wx:if=”{{classic.type===200}}”  img=”{{classic.img}}”  content=”{{classic.content}}”></v-music>合理展现分离内容,不要使用内联样式。//推荐使用<image class=”tag”></image> 2.     注释规范除组件外的其他块级元素,均需注释出其功能,并在其上下空出一行与其他代码进行区分。<view>…</view>//导航栏<view>…</view><view>…</view CSS规范 1.    CSS规范在开发过程中rpx和px均可能用到,如通常情况下间距使用rpx,字体大小和边框等使用px,开发者根据实际情况而定。width: 100rpx;font-size: 14px;CSS代码需有明显的代码缩进。每一个样式类之间空出一行。.v-tag{  width: 100%;}.v-container{  width: 100%;}尽量使用简写属性,并且同一属性放置在一起,避免散乱。/**使用简写属性**/.v-image{  margin: 0 auto;}/**同一属性放在一块**/.v-tag{  margin-left: 10rpx;  margin-right: 10rpx} 采用flex进行布局,禁止使用float以及vertical-align。.container{  disaplay: flex;  flex-dirextion: row} 2.     注释规范成组的wxss规则之间用块状注释。请勿在代码后面直接注释。/** 修改button默认的点击态样式类**/.button-hover {  background-color: red;} JS规范 1.     JS规范 命名规范变量名以及函数名统一采用驼峰命名法,正常情况下函数名前缀需加上清晰的动词表示函数功能,私有函数或者属性以下划线开头表明。常量需用const 声明。类的命名首字母需大写。采用ES6 关键字let定义变量,尽量不使用var//定义常量const a = 1//定义变量let imageContent =  res.data//函数命名getInfo:function(){  return ”;}//私有函数_getInfo:function(){  return ”; 回调函数规范回调函数统一使用Promise函数的方式进行编写,回调成功的参数统一为res,错误参数为err。// promise 处理回调let back = new Promise((resolve, reject) => {  if (/* 异步操作成功 */){    resolve(value);  } else {    reject(error);  }});back.then((res) => {    console.log(‘成功回调!’, res);}).catch((err) => {    console.log(‘失败回调!’, error);}); 私有函数以及回调函数统一放置在生命周期函数后。 删除js文件中未用到的生命周期函数,保持代码的整洁。Pages({  data:{       },    onLoad:function(event){      },    _self:function(){      }}) 每个函数之间用一个空行分离结构。 数据绑定变量定义规范所有涉及到数据绑定的变量均需在data中初始化。禁止在不定义的情况下直接setData。Pages({  data:{     id : null  },    onLoad:function(event){    let id = event.target.dataset.id    this.data.id = id  }})点击事件规范点击事件函数命名方式为 on + 事件名 或者业务名。onLike: function(event){  }  组件规范 组件名命名规范组件在使用时命名以 “v-”为开头的组件名,若组件名称为多个单词名拼接而成,采用 ‘ – ‘ 连接。组件标签在page页面使用时推荐使用单闭合标签(此条约束对于包含有slot的组件无效)v 来源于法语 单词 ‘vent’ @林间有风<v-movies /> 触发事件规范组件点击触发事件建议用冒号分隔开<v-component-tag-name bind:myevent=”onMyEvent” /> externalClasses命名规范命名格式采用如下形式:v-class-{name},name可自行定义v-class-icon 组件样式规范我们团队所产出的所有组件样式均应采用类的写法,且命名必须以 v- 开头,不允许使用内联样式以及id样式.v-container{  disaplay: flex;  flex-dirextion: row} 标点规范JS语句无需以分号结束,统一省略分号JS中一致使用反引号 “或单引号’ ‘ , 不使用双引号。WXML、CSS、JSON中均应使用双引号。CSS属性中冒号中后面用一个空格分隔开。执行一致的缩进(4个空格)执行一致的换行样式(’unix’)

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序开发规范文档(非唯一)
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏