Beispiele für Uni-App-Anrufe auf verschiedenen Plattformen

Szenario

Anrufe in der App zu tätigen ist ein relativ häufiges Anwendungsszenario, aber bei der Suche nach Artikeln haben wir festgestellt, dass die meisten Blogbeiträge Kopien der offiziellen Website von uni-app sind, die copy

uni-app bereitstellt Das Telefon hilft Ihnen nur beim Aufrufen der Wählschnittstelle und kann keine direkten Anrufe tätigen, IOS jedoch aufgrund von Berechtigungsproblemen nicht. Wir können also ein Urteil fällen. Wenn es sich um Android handelt, klicken Sie auf Wählen Sie das Telefon direkt an. Verwenden Sie für andere Plattformen die Standard-Einwahlschnittstelle von uni-app

HTML5+-Schnittstelle plus.device.dial. Um dieses SDK zu verwenden, müssen Sie das Paket einführen. Die externe Schnittstelle der App ist uni. makePhoneCall

IOS und Andriod bieten native Schnittstellen – Wenn Sie mit der nativen Entwicklung nicht vertraut sind, werden Sie Schwierigkeiten haben

Auf der H5-Seite des mobilen Browsers

<a href="tel: 10086">10086</a>复制代码

Kein weiterer Unsinn, gehen Sie einfach zu Codebeschreibung Das Folgende wird durch bedingte Kompilierung + jede Plattformcode-Schnittstelle implementiert

testDevice.vue

<view>
  <!-- #ifdef APP-PLUS -->
  <button @tap="telphone">拨打电话</button>
  <!-- #endif -->

  <!-- #ifdef H5 -->
  <a href="tel:10086">10086-h5平台下</a>
  <!-- #endif -->
</view>

<script>
  // 对不同的平台有一点区分
  import telphone from &#39;./telphone.js&#39;
  export default {
    methods: {
      telphone() {
        // 通过传递电话参数，调用不同平台拨打电话的功能
        telphone("10086")
      }
    }
  }
</script>复制代码

Wir achten hier nicht auf Schnittstellenprobleme, um die Aufmerksamkeit der Leser nicht abzulenken. Wir konzentrieren uns auf die Implementierung in js

Bitte beachten Sie diese Bedingungen Die zu verwendende Kompilierung kann verschiedene Szenarien unterstützen (IOS und Andriod), und die folgende ist die normale h5

telphone.js

//#ifdef H5
import VConsole from 'vconsole'

new VConsole()
//#endif

export default (phone) => {
    // 获取设备平台
    let platform = uni.getSystemInfoSync().platform
 
    //#ifdef H5
    // h5环境--浏览器
    let ua = navigator.userAgent.toLowerCase()
    // 就要判断 是微信内置浏览器还是用户的普通浏览器

    if (ua.match(/MicroMessenger/i) == "micromessenger") {
        // 微信浏览器
        console.log('微信浏览器')
    } else {
        // 普通浏览器 
    }
    //#endif

    //#ifdef APP-PLUS
    // app环境
    switch (platform) {
        case 'android':
            // 导入Activity、Intent类
            var Intent = plus.android.importClass("android.content.Intent");
            var Uri = plus.android.importClass("android.net.Uri");
            // 获取主Activity对象的实例  
            var main = plus.android.runtimeMainActivity();
            // 创建Intent  
            var uri = Uri.parse("tel:" + phone); // 这里可修改电话号码  
            var call = new Intent("android.intent.action.CALL", uri);
            // 调用startActivity方法拨打电话  
            main.startActivity(call);
            break;
        case 'ios':
            // 使用uni-app提供的借口
            uni.makePhoneCall({
                phoneNumber: phone
            })
            break;
        default:
            // 调试器工具
    }
    //#endif
}复制代码

Notes

Bedingte Kompilierung Wenn Sie die bedingte Kompilierung nicht verwenden, wird auf der App-Seite ein Fehler gemeldet

Stellen Sie sicher, dass Sie die Importanweisung nicht in eine Beurteilung oder einen ternären Vorgang schreiben, da sonst ein Fehler gemeldet wird. Sie müssen den Mechanismus zum Laden des ES6-Moduls verstehen.

Verwenden Sie Von Uni-App bereitgestellte Schnittstelle, um zu beurteilen, ob es sich um eine App-Plattform (IOS oder Andriod) handelt, wie man zwischen normalen Browsern und WeChat-Browsern unterscheidet oder sich auf die bedingte Kompilierung verlässt

Das Obige, ob es sich um die von Uni-App bereitgestellte API-Implementierung handelt oder Das Andriod-SDK verlässt die App, um einen Anruf zu tätigen. Es wird immer noch zur App-Schnittstelle zurückgerufen Zusammenstellung, um die aktuelle Umgebung zu bestimmen. Tatsächlich ist es dasselbe wie die Einführung von vconsole.
• Weitere Artikel finden Sie in der Spalte „Uni-App“.

Das obige ist der detaillierte Inhalt vonBeispiele für Uni-App-Anrufe auf verschiedenen Plattformen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!