点我扫二维码，查看demo

# LaunchApp 唤起美居

# 介绍

用于外部调起/下载美居 APP

# 引入

import Vue from 'Vue'
import { mxLaunchApp } from 'mui-event'
import 'mui-event/lib/index/index.css'
Vue.use(mxLaunchApp)

1
2
3
4

# 代码演示

# 基础用法

移动端已下载美居 APP ，自动唤起美居。未下载美居 APP ，进入下载页。

<mx-launch-app>
    <div class="common-class">
        <span class="text-class">唤起美居APP，进入首页</span>
    </div>
</mx-launch-app>

1
2
3
4
5

# android 环境，引导下载美居 APP

安卓系统可以通过 androidDownload 属性控制下载方式。

<mx-launch-app :androidDownload="yingyongbao">
    <div class="common-class">
        <span class="text-class">前往应用宝，下载美居APP</span>
    </div>
</mx-launch-app>
<mx-launch-app :androidDownload="androidAppMarket">
    <div class="common-class">
        <span class="text-class">前往App Store，下载美居APP</span>
    </div>
</mx-launch-app>
<mx-launch-app :androidDownload="downloadApk">
    <div class="common-class">
        <span class="text-class">下载美居安卓安装包</span>
    </div>
</mx-launch-app>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

export default {
  data() {
    return {
      yingyongbao: '1',
      androidAppMarket: '2',
      downloadApk: '3',
    }
  }
}

1
2
3
4
5
6
7
8
9

# ios 环境，引导下载美居 APP

ios系统可以通过 iosDownload 属性控制下载方式

<mx-launch-app :iosDownload="iosAppMarket">
    <div class="common-class">
        <span class="text-class">前往App Store，下载美居APP</span>
    </div>
</mx-launch-app>

1
2
3
4
5

export default {
  data() {
    return {
      iosAppMarket: '2',
    }
  }
}

1
2
3
4
5
6
7

# 唤起美居，跳转至美居内指定URL

移动端可以通过 targetUrl 与 mjJumpType 两个属性配合使用，跳转至指定 URL

<mx-launch-app :targetUrl="target" :mjJumpType="jumpType">
    <div class="common-class">
        <span class="text-class">前往美居指定页面</span>
    </div>
</mx-launch-app>

1
2
3
4
5

export default {
  data() {
    return {
      target:
        'https%3A%2F%2Factivity.msmartlife.cn%2Factivity%2F202201%2Felectricity2%2Findex.html',
      jumpType: 'jumpWebViewNew',
    }
  }
}

1
2
3
4
5
6
7
8
9

# API

# Props

参数	说明	类型	默认值	必填
iosDownload	`ios` 打不开美居时的行为	String	`0`	否
androidDownload	`android` 打不开美居时的行为	String	`0`	否
mjJumpType	调起美居的页面类型，可与 `targetUrl` 配合使用	String	`jumpNative`	否
targetUrl	需跳转至美居内指定页面的 `url`	String	无	否
pgfromParam	美居下载页的 `url` 参数,用于下载页埋点	String	无	否
launchstyle	自定义样式	Object	`{}`	否

# androidDownload 格式

参数	说明
0	前往美居下载页
1	前往应用宝
2	前往安卓应用市场
3	下载安装包

# iosDownload 格式

参数	说明
0	前往美居下载页
2	前往 App Store
自定义链接	`http://`形式的自定义链接，用于跳转至指定页面或下载指定渠道包

# mjJumpType 格式

参数	说明
jumpWebView	打开 H5 页面
jumpNative	打开原生页面(只支持 url，暂不支持 pageName)
jumpWeex	打开 weex 页面(只支持 url，暂不支持 pageName)
jumpElecBusiness	跳转电商 H5 页面

← imageResizer 裁剪图片 signatureActivity 签名 →