uniapp安卓双屏(副屏)异显
时间: 2023-12-10 14:02:55 浏览: 197
为了实现uniapp安卓双屏异显,需要在sub-screen/build/webpack.prod.conf.js文件的output中添加publicPath:"./"配置。具体步骤如下:
1. 在manifest.json文件中添加以下代码:
```json
{
"name": "your app name",
"display": "standalone",
"orientation": "landscape",
"start_url": "/",
"background_color": "#000000",
"theme_color": "#000000",
"permission": {
"supportScreen": true,
"supportDualScreen": true
}
}
```
2. 在sub-screen/build/webpack.prod.conf.js文件的output中添加publicPath:"./"配置,具体代码如下:
```javascript
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js'),
publicPath: "./" // 添加这一行配置
},
```
3. 在App.vue文件中添加以下代码:
```html
<template>
<div>
<div v-if="isDualScreen">
<!-- 副屏内容 -->
</div>
<div v-else>
<!-- 主屏内容 -->
</div>
</div>
</template>
<script>
export default {
computed: {
isDualScreen() {
return window.screen.availWidth == 1920 && window.screen.availHeight == 1080;
}
}
}
</script>
```
以上就是uniapp安卓双屏异显的实现方法。