Implementación de reemplazo de documentos en uni-app

Objetivo: lograr un clic en el área objetivo para mostrar el contenido correspondiente

Como no hay ningún objeto de documento en el teléfono móvil, solo se puede lograr vinculando la clase con el operador trinocular. Lograr

                    <view class="dream_data_li" v-for="(item,index) of list" :key="index"> <label class="name">梦到:&nbsp;&nbsp;{{item.title}}</label> <label class="value">{{item.desc}}<label class="more" @click="fun_show_more(item)">更多...</label></label> <view :id="'ID'+item.id" class="desc" v-bind:class="[(sel_ID==item.id) ? 'showdesc' : '']"> {{item.all}} </view> </view> <style> .dream_data_li>.desc { /* margin-left: 120px; */ display: none; font-size: 14px; padding-right: 10px; background-color: #cdffc1; padding: 5px; box-shadow: 10px 10px 10px #cacaca; border-radius: 5px; } .dream_data_li>.showdesc { display: block !important; } </style>

Mediante el método para modificar dinámicamente la variable sel_ID para lograr si se muestra el área relevante

           fun_show_more:function(item){
				// console.log(item);
				// document 这个是浏览器端的,APP端没有的 // document.getElementById('ID'+item.id).style.display='block'; this.sel_ID=item.id; // 有BUG // setTimeout(() => { // // const query = uni.createSelectorQuery().in(this); // const query = uni.createSelectorQuery(); // console.log(query); // query.selectAll('#ID'+item.id).boundingClientRect(data => { // console.log("得到布局位置信息" + JSON.stringify(data)); // console.log("节点离页面顶部的距离为" + data.top); // // console.log("节点离页面顶部的距离为" + data.top); // console.log(data); // }).exec(); // },200); }