eslint 不喜欢,但是确实规范了代码,同古代统一货币一样,有无穷的意义。故喜欢
weex-ui在项目中的使用方法

npm install -g weex-toolkit@latest
weex create your_project
npm i
npm i weex-ui@latest -S
npm i babel-plugin-component babel-preset-stage-0 -D
//修改.babelrc代码
{
"presets": ["es2015", "stage-0"],
"plugins": [
[
"component",
{
"libraryName": "weex-ui",
"libDir": "packages",
"style": false
}
]
]
}

修改 src/index.vue 进行测试

<template>
<div>
<wxc-button text="Open Popup"
@wxcButtonClicked="buttonClicked">
</wxc-button>
<wxc-popup width="500"
pos="left"
:show="isShow"
@wxcPopupOverlayClicked="overlayClicked">
</wxc-popup>
</div>
</template> <script>
import { WxcButton, WxcPopup } from 'weex-ui';
module.exports = {
components: { WxcButton, WxcPopup },
data: () => ({
isShow: false
}),
methods: {
buttonClicked () {
this.isShow = true;
},
overlayClicked () {
this.isShow = false;
}
}
};
</script>

运行项目
npm run serve
项目效果如下

【难为听】weex-ui的更多相关文章

  1. Weex Ui - Weex Conf 2018 干货分享

    本文是2018年 Weex Conf 中议题<Weex + Ui>的内容文档整理,主要给大家介绍飞猪 Weex 技术体系从无到有的过程,包括 Weex Ui 组件库的开发和发展,重点分享在 ...

  2. Weex Ui 是一个基于 Weex 的富交互、轻量级、高性能的移动端 UI 组件库

    Github资源:https://github.com/alibaba/weex-ui 预览 你可以通过飞猪.淘宝.天猫.Weex Playground 或者浏览器扫码体验 安装 npm i weex ...

  3. UI事件监听的击穿

    什么是UI事件监听的击穿 在游戏视图中,有两个UI界面叠在一起的时候,单击一个空白处,却触发了被覆盖在下层了UI界面中的单击事件,这就是单击击穿了上层界面. 假设场景中放置了一个箱子,单击箱子会触发一 ...

  4. MS UI Automation Introduction

    MS UI Automation Introduction 2014-09-17 MS UI Automation是什么 UIA架构 UI自动化模型 UI自动化树概述 UI自动化控件模式概述 UI 自 ...

  5. Weex学习资料整合

    1.weex weex文档:http://weex.apache.org/cn/guide/index.html Weex Ui awesome-weex WEEX免费视频教程-从入门到放肆 (共17 ...

  6. Weex与Android交互(二)

    扩展Android Weex 提供了扩展机制,可以根据自己的业务进行定制自己的功能. 主要分为两类扩展: Module 扩展 非UI的特定功能.例如sendHttp.openURL 等. Compon ...

  7. #Weex与Android交互(一)

    用Weex开发Android程序 参考:开发HelloWorld程序(Weex开发) 1.创建Android工程 2.集成WeexSDK,参考[WEEX SDK 集成到 Android 工程](htt ...

  8. avalon新一代UI库发布

    任何前端框架,尤其是国内的,想推广开,必须有一个UI库,光是一个核心库当光头司令是不行的.此外还有一个小圈子,供大家遇到问题时可以发问,一起完善.自从avalon嫁入"去哪儿网"后 ...

  9. weex前端式写法解决方案---eros

    前言 如果想用前端的方式写一个app怎么办呢? 如果你用的是 React,那么它已经有了一个比较完善的体系跟社区.如果你用的是Vue又不想花费太多时间去重新学习React,那么目前比较靠谱的方案就是w ...

随机推荐

  1. iOS 更新日志 - 持续更新中

    本文只是为了简单记录一下每个正式版本发布时间和更新内容,只有这个初衷,从2019年9月25日开始,将会持续更新. iOS 13.1 - 2019年9月25日 iOS 13.1 iOS 13.1 包括错 ...

  2. THUWC 游记

    考试前的一个周末 PKUWC没过,去不了,自闭,我死了. 考试前的星期一 THUWC居然过了!!!大恩大德永世难忘,我又活了. 考试前的周四 WTF!??为什么要用Ubuntu,我完全不会,凉了凉了, ...

  3. Android 开发 Camera2开发_3_处理预览和拍照偏暗问题

    通过调整曝光解决 参考:https://stackoverflow.com/questions/28429071/camera-preview-is-too-dark-in-low-light-and ...

  4. 洛谷1850(NOIp2016) 换教室——期望dp

    题目:https://www.luogu.org/problemnew/show/P1850 状态里记录的是”上一回有没有申请“,而不是”上一回申请成功否“,不然“申请 j 次”就没法转移了. dou ...

  5. 原生ajax请求json数据

    <?php header("content-type:text/html;charset=utf-8"); echo '{"name":"小明& ...

  6. Git的基本了解与使用、向github提交代码

    #Git的基本了解与使用.向github提交代码- git:是一个版本控制系统.- github:一个代码托管提供商.开源网站.是一个面向开源及私有软件项目的托管平台,因为支持Git作为唯一的版本库格 ...

  7. canvas扇形进度圈动态加载

    效果图如下:动态加载的 实现代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  8. Hdu 1403(后缀数组)

    题目链接 Longest Common Substring Time Limit: 8000/4000 MS (Java/Others)    Memory Limit: 65536/32768 K ...

  9. UML类图解释

    那个动物矩形框,它就代表一个类(Class).类图分三层,第一层显示类的名称,如果是抽象类,则就用斜体显示.第二层是类的特性,通常是字段和属性.第三层是类的操作,通常是方法或行为.注意前面的符号,“+ ...

  10. nginx日志修改时间格式为年月日时分秒

    先解除这段注释,使用自定义日志格式 $time_iso8601 生成格式:--20T09::+: $time_local 生成格式: /Apr/::: + 还是选择年月日时分秒看起来舒服一点