美文网首页
Weex首秀(1)

Weex首秀(1)

作者: 阿追老师Jason | 来源:发表于2017-02-03 09:10 被阅读0次

一直想做一个APP,去年也自学过一段时间的React Native, 但是RN相对来说学习曲线比较陡峭,并且很多资源包在下载时都不是那么容易,经常error(这个大家都懂), 所以这事儿就不了了之了。

前两天看了weex的会议,觉得阿里又在放大招了,这个工具虽然目前学习社区不多,资源组件不丰富,但是本身调式来发非常便捷,weex playground非常不错,并且因为weex是基于vue的,所以入门简单,npm run build打包以后部署到自己的服务器上,用二维码扫描以后就可以拥有一个自己的APP了,并且是兼容三端的,这一点非常诱人。

于是,我就从github上找到了一个别人的项目,https://github.com/dodola/WeexOne,然后改造一个属于自己的APP。
总体样式如下:

开始动手!

首先,引入了picker组件,这个组件用来进行时间选择,前端效果不错。


 require('weex-components');
    const picker = require('@weex-module/picker');
  export default {
    data () {
      return {
        value: ''
      }
    },
    methods: {
      pickTime () {
        picker.pickTime({
          value: this.value
        }, event => {
          if (event.result === 'success') {
            this.value = event.data
          }
        })
      }
    }
  }

接下来想尝试一下vue中的组件能否在weex中使用,比如UI组件mint,并且引入API数据。

未完待续。

相关文章

  • Weex首秀(1)

    一直想做一个APP,去年也自学过一段时间的React Native, 但是RN相对来说学习曲线比较陡峭,并且很多资...

  • Weex首秀(2)

    首先祝各位鸡年大吉,开工大吉!趁着今天刚开工,工作任务还不多,可以继续学些Weex。 春节在家无聊的时候,继续跟进...

  • Weex资源大全,持续更新中...

    1、Weex官网2、weex-uI3、Weex 快查手册

  • weex命令

    1,创建weex项目脚手架 weex create— 创建 weex 工程项目 2,增加/删除平台 weex pl...

  • 深入Weex系列(八)之Weex SDK架构分析

    1、前言 经过前面几篇Weex源码分析系列文章,相信大家对Weex是什么、Weex能带来什么、Weex是如何工作的...

  • (26)打鸡儿教你Vue.js

    weex框架的使用 1、weex开发入门2、weex开发环境搭建3、掌握部分weex组件模块4、了解一些vue基本...

  • WEEX快速创建工程 Hello World

    1.按照weex官网搭建环境,安装依赖(安装node 和 npm,weex-toolkit,安装完后可以weex ...

  • 阿里巴巴 weex iOS集成

    weex Github传送 https://github.com/alibaba/weex 准备 1.Node.j...

  • weex打包Android和IOS

    1.安装weex 安装结束后你可以直接使用 weex help 命令验证是否安装成功,它会显示 weex 支持的所...

  • Weex框架浅析

    1,Weex 是什么? Weex 是使用流行的 Web 开发体验来开发高性能原生应用的框架 ,Weex 致力于使开...

网友评论

      本文标题:Weex首秀(1)

      本文链接:https://www.haomeiwen.com/subject/coxdittx.html