文档章节

we-chat-app-platform 微信小程序平台

MadDragon
 MadDragon
发布于 2018/03/23 22:55
字数 669
阅读 24
收藏 1

we-chat-app-platform 微信小程序平台

一个巨型项目。。。。 慢慢来。

技术栈

1、vue

2、vue-router

3、vuex

4、axios

5、iview

6、element-ui

7、moment

8、babel-polyfill

相关功能使用介绍

一、接口调用

1、get调用

 this.get('/type/list', params).then(res => {
        console.log(res);
      });

直接使用 this.get() 方法就可

2、post调用

 this.post('/type/list', params).then(res => {
        console.log(res);
      });

直接使用 this.post() 方法就可

其他相关功能以此类推

二、时间插件(moment.js)

1、格式化时间

 console.log(this.moment().format('YYYY-MM-DD HH:mm:ss'));
 console.log(this.moment().format('X'));

其他相关功能以此类推

三、Utils 工具类

1、time 模块

  • formatTime 格式化时间

console.log(this.utils.formatTime());

其他相关功能以此类推

  • formatAddTime 时间 加法 并 格式化时间

console.log(this.utils.formatAddTime(createTime, 'YYYY-MM-DD HH:mm:ss', days))

其他相关功能以此类推

  • formatSubtractTime 时间 减法 并 格式化时间

  • formatInitTime 格式化 初始 时间

  • startTime 搜索 开始时间

  • endTime 搜索 结束时间

2、public 模块

  • getArrName 在 key name 数组中 获取 name

console.log(this.utils.getArrName(state.orderTypeList, orderType));

其他相关功能以此类推

  • getArrTitle 在 key title 集合中 获取 title

3、cookie 模块

  • 设置cookie

this.cookie.setCookie('wsl', { a: 122 },360,'/');
  • 获取cookie

this.cookie.getCookieValue('wsl');
  • 删除cookie

this.cookie.deleteCookie('wsl','/');

4、localStorage 模块

  • 存储localStorage

this.storeage.setStore('wsl', { a: 122 });
  • 获取localStorage

this.storeage.getStore('wsl');
  • 删除localStorage

this.storeage.removeStore('wsl');

5、sessionStorage 模块

  • 存储sessionStorage

this.session.setItem('wsl', { a: 122 });
  • 获取sessionStorage

this.session.getStore('wsl');
  • 删除sessionStorage(指定)

this.session.removeStore('wsl');
  • 删除sessionStorage(所有)

this.session.clear();

6、过滤器

未封装完成

  • 求时间差

四、阿里的 icon 图标

美工从 阿里 iconfont 导出后添加到项目 直接根据 iconfont.css 的 .icon-brush 使用

<i class="iconfont icon-brush" style="font-size:50px"></i>

五、百度编辑器使用

1、添加 js 挂载器

<template>
  <div class="components-container">
    <button @click="getUEContent()">获取内容</button>
    <div class="editor-container">
      <UE :defaultMsg=defaultMsg :config=config :id=ue1 ref="ue"></UE>
    </div>
  </div>
</template>

2、增加配置

<script>
// import UE from '@/components/ue/ue.vue';
import UE from '@/components/ue';

export default {
  components: { UE },
  data() {
    return {
      defaultMsg:
        'editor.vue?5c45:42 <p style="text-align: left; margin-bottom: 5px;">这里是U</p><p style="text-align: center; margin-bottom: 5px;"><img src="/ueditor/php/upload/image/20171015/1508063519822204.jpg" title="1508063519822204.jpg"/></p><ol class=" list-paddingleft-2" style="list-style-type: decimal;"><li><p style="line-height: normal; margin-bottom: 10px;"><img src="/ueditor/php/upload/image/20171015/1508063519100952.jpg" title="1508063519100952.jpg"/><img src="http://img.baidu.com/hi/jx2/j_0047.gif"/><img src="http://img.baidu.com/hi/jx2/j_0029.gif"/>szdfs18:44:04</p></li><li><p style="margin-bottom: 5px;">sdfsd</p></li><li><p style="margin-bottom: 5px;">sdf</p></li></ol><p style="margin-bottom: 5px;">sdf<br/></p><pre class="brush:php;toolbar:false;">h</pre><p style="margin-bottom: 5px;"><br/></p><p style="margin-bottom: 5px;"><br/></p><pre class="brush:diff;toolbar:false">sssfsdsdfsdfsdfsdf</pre><p><br/></p><p><br/></p><p style="margin-bottom: 5px;">E测试<br/></p>',
      config: {
        initialFrameWidth: null,
        initialFrameHeight: 350
      },
      ue1: 'ue1' // 不同编辑器必须不同的id
    };
  },
  methods: {
    getUEContent() {
      let content = this.$refs.ue.getUEContent(); // 调用子组件方法
      // this.$notify({
      //   title: '获取成功,可在控制台查看!',
      //   message: content,
      //   type: 'success'
      // });
      console.log(content);
    }
  }
};
</script>

© 著作权归作者所有

共有 人打赏支持
MadDragon
粉丝 5
博文 40
码字总数 21551
作品 0
杭州
程序员
私信 提问
前端资源系列(3)-微信小程序开发资源汇总

微信(小程序or应用号)开发资源汇总-文档-工具-教程-代码-插件-组件 文档 从搭建一个微信小程序开始 小程序开发文档 小程序设计指南 工具 小程序开发者工具 - 官方 Egret Wing 3.2.x 支持微信...

xzavier
2018/08/27
0
0
掘金开发者大会 ∙ 微信小程序专场

掘金开发者大会 ∙ 微信小程序专场正式启动 一场迟来的聚会 自2017年1月微信小程序正式上线以来,应用数与开发者数持续增长,目前已经有超过100万个微信小程序发布且相关开发者也超过了150万...

掘金
2018/08/07
4
0
掘金开发者大会 ∙ 微信小程序专场 | 一场汇聚了微信小程序日活前十名半数的开发者大会,邀您参加!

掘金开发者大会 ∙ 微信小程序专场 一场迟来的聚会 自2017年1月微信小程序正式上线以来,应用数与开发者数持续增长,目前已经有超过100万个微信小程序发布且相关开发者也超过了150万。同样,...

稀土君
2018/08/06
0
0
掘金开发者大会 ∙ 微信小程序专场正式启动

一场迟来的聚会 自2017年1月微信小程序正式上线以来,应用数与开发者数持续增长,目前已经有超过100万个微信小程序发布且相关开发者也超过了150万。同样,我们也可以通过掘金的数据看到 2017...

掘金官方
2018/08/07
0
0
微信小程序开放公测,企业、政府及媒体可申请

11 月 3 日晚间,微信团队对外宣布,微信小程序开放公测,开发者可登陆微信公众平台申请,开发完成后可以提交审核,公测期间暂不能发布。 根据微信团队的介绍,开放注册范围为企业、政府、媒...

局长
2016/11/03
3.5K
15

没有更多内容

加载失败,请刷新页面

加载更多

《大数据白皮书(2018年)》发布(解读版+完整版PPT)

数据观微信小编获悉,为更好促进大数据与实体经济融合,研判技术发展路径,总结管理痛点、描绘发展趋势,总结行业应用渗透路径,4月18日,在“2018大数据产业峰会”上,中国信息通信研究院(...

了凡川
6分钟前
0
0
从小白到月薪上万,一份完整的大数据路线分析出自我成长书单

大数据原理与实践 大数据分三大部分,包括:大数据基础、技术原理和创新实践。 大数据基础部分主要介绍大数据的基本概念、技术架构和大数据的应用场景; 第二部分大数据技术原理主要介绍大数...

董黎明
17分钟前
0
0
斗鱼直播确定赴美IPO 此前融资额已达70亿元

据最新消息,斗鱼直播高层人士向新京报证实,斗鱼直播确定赴美IPO(首次公开募股),此前融资额已达70亿元。 此前,多家媒体报道,由国内知名直播平台斗鱼(Douyu)已秘密提交赴美IPO文件。 ...

ThinkSNS官方帐号
18分钟前
0
0
虎牙直播在微服务改造方面的实践和总结

相比文字和图片,直播提供了人与人之间更丰富的沟通形式,其对平台稳定性的考验很大,那么倡导“以技术驱动娱乐”的虎牙直播(以下简称“虎牙”)是如何在技术上赋能娱乐,本文将为您介绍虎牙...

阿里云云栖社区
22分钟前
0
0
采用SpringBoot整合Mybatis框架插入数据时报错及解决

这两天做SpringBoot整合Mybatis项目的时候,插入时报错: 3:45:59.936 DEBUG [http-nio-8080-exec-8] o.s.w.s.m.m.a.ExceptionHandlerExceptionResolver 133 - Resolving exception from ha......

aiChuang
28分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部