uniapp 重写 video标签

通过引用中的代码，我们可以看到如何重写内置标签。在重写video标签之前，我们需要进行一些准备工作。首先要了解什么是内置标签，它们是HTML里约定的一些元素，例如div、button等，以及SVG里约定的一些标签，例如image、view等。

在main.js中，我们需要进行一些配置来解决报错。首先，设置Vue.config.ignoredElements为['uni-button']，这样可以避免uni-button标签报错。然后，设置Vue.config.isReservedTag方法来重写内置标签的判断逻辑。我们可以参考上面引用[1]中的代码，将overrideTags数组添加上video标签。

import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false
Vue.config.ignoredElements = ['uni-button']
const overrideTags = ['button', 'video']

const oldIsReservedTag = Vue.config.isReservedTag;
Vue.config.isReservedTag = function(tag){
if(overrideTags.indexOf(tag) !== -1){
return false;
}
return oldIsReservedTag(tag);
};

new Vue({
render: h => h(App),
}).$mount('#app')

通过以上代码的设置，我们成功重写了video标签，可以在uniapp中正确渲染video标签了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [uni-app 黑魔法探秘 （一）——重写内置标签](https://blog.csdn.net/qiwoo_weekly/article/details/129292570)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]