WeexでUI （weex-ui）

WeexでUIを使うにはweex-uiを使うのがいい。

alibaba.github.io

インストール

-Dは--save-devの略

npm i babel-preset-stage-0 babel-plugin-component -D
npm i weex-ui -S

or

yarn add --dev yarn add babel-preset-stage-0
yarn add --dev babel-plugin-component
yarn add weex-ui

使用方法

準備

webpack.config.jsにexclude: /node_modules(?!(\/|\\).*(weex).*)/を追加とあるがすでになっているはず。 実際はconfigs/webpack.common.conf.jsというファイルに書いてあり、webpack.config.jsからリンクされていた。

.babelrcに追加

{
    "presets": ["es2015", "stage-0"],
    "plugins": [
        [
            "component",
            {
                "libraryName": "weex-ui",
                "libDir": "packages",
                "style": false
            }
        ]
    ]
}

自分のコンポーネントで使う

まずインポート

<script>
import { WxcRadio } from "weex-ui";

コンポーネントとして追加、

export default {
  name: "Setting",
  components: { WxcRadio }, // この行を追加
  methods: {
    jump(url) {
      this.$router.push(url);

HTMLに追加

<wxc-radio :list="list" @wxcRadioListChecked="wxcRadioListChecked"></wxc-radio>

クリックの属性はwxcRadioListCheckedなので注意。

アリババ 中国eコマース覇者の世界戦略

ジャック・マー アリババの経営哲学

Ａｌｉｂａｂａ　アリババの野望　世界最大級の「ＩＴの巨人」ジャック・マーの見る未来　（角川ebook　nf） (角川ebook nf)