There are two different components in the vue 2.0 page that use the same component as a subcomponent, so there may be problems with the same id.

example:
father_1 component has a < xxx > subcomponent < / xxx > subcomponent
father_2 component also has a < xxx > subcomponent < / xxx > subcomponent

Sub-component < xxx > < / xxx > has a tag with id = "xxx_id"
if you don"t pay attention, there will be two id, with the same tag on the page. How can you avoid this situation?
Thank you for your comments.

Javascript
Apr.10,2021

id is unique, without

find a way to replace it with something else, or className

< hr >

if you really need id, make it dynamic. : id= "getOwnerId" . The key of your two components must be different, so use key to make sure that the id is unique

.

after using the framework, id is basically out of use and is not recommended, because it is possible to encounter the situation you are talking about. If you need to access DOM, you should also use this.$el or this.$refs.XXX

. 
<template>
    <div>
        <video id="video"/>
    </div>
<template>
<script>
...
    mounted(){
        videojs('video');
        // 
        // videojs(document.getElementById('video'));
    }
...
</script>
<template>
    <div>
        <video ref="video"/>
    </div>
<template>
<script>
...
    mounted(){
        videojs(this.$refs.video);
    }
...
</script>

ide/components-edge-cases.html-sharp%E8%AE%BF%E9%97%AE%E5%AD%90%E7%BB%84%E4%BB%B6%E5%AE%9E%E4%BE%8B%E6%88%96%E5%AD%90%E5%85%83%E7%B4%A0" rel=" nofollow noreferrer "> https://cn.vuejs.org/v2/guide.

you can pass in an internal id from outside, such as < xxx: domId= "xxx" > < / xxx >;
can be controlled externally, so you can avoid the id with the same two subcomponents;
upstairs is fine, use ref

if you simply add css styles, id is not unique but also can

using vue generally does not use id to do any interaction, so if you are lazy, you can ignore it, and if you have obsessive-compulsive disorder, you can change it to class,.

first of all, I want to know what id is used for. If you are writing a style, then style can add the scoped attribute. Again, your vue project is not built out of scaffolding.

Previous: After ant design pro starts, it defaults to the page after login. Ask how to set it to be the landing page. There is a problem with the jump after changing the permission of guest.

Next: Why is the base64 from toDataURL blank?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb7df5-268b.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb7df5-268b.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?