Vue3中自定义锚点无法使用

[frankwang0507]

Vue3的onMounted生命周期中可以获取到组件最外层的div，获取不到组件内部的h1, h2, h3, h4....

[yamonc]

版本：2.3.15，确实不能用！

[xiaojinping]

vue3中的自定义锚点，内部的方法名，应该是previewScrollToTarget，另外，测试时发现，如果给了组件一个固定的高度，也没有效果。

[kingyumua]

vue2中自定义锚点也是没有效果，提示scrollToTarget函数没有定义

[fingerdancer]

Vue3的onMounted生命周期中可以获取到组件最外层的div，获取不到组件内部的h1, h2, h3, h4....

我放到setTimeout里面，能取到了

[yulex6]

Vue3的onMounted生命周期中可以获取到组件最外层的div，获取不到组件内部的h1, h2, h3, h4....

我放到setTimeout里面，能取到了 dom还没更新，需要在await nextTick()后获取

[yulex6]

ScrollToTarget没有作用的可以试试将window改成 v-md-preview的父级元素

[yiyuqi]

这个怎么解决的，我也遇到了

[yulex6]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

[yiyuqi]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

[yulex6]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

是的，我的可以

[yiyuqi]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

是的，我的可以

我把代码发您，可以帮忙看下么

[yulex6]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

是的，我的可以

我把代码发您，可以帮忙看下么

可以

[yiyuqi]

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

是的，我的可以

我把代码发您，可以帮忙看下么

可以

就是官网里面的代码，官网地址：https://ckang1229.gitee.io/vue-markdown-editor/zh/senior/anchor.html

[yulex6]

我就是对着官网代码弄的呀，就是改了下scrollContainer

任性ㄨ无框宅 @.***

 

------------------ 原始邮件 ------------------ 发件人: "code-farmer-i/vue-markdown-editor" @.>; 发送时间: 2023年7月11日(星期二) 下午3:55 @.>; @.@.>; 主题: Re: [code-farmer-i/vue-markdown-editor] Vue3中自定义锚点无法使用 (Issue #217)

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

这个怎么解决的，我也遇到了

preview.value.scrollToTarget({ target: heading, scrollContainer: document.querySelector(".target") , top: 60, }); <el-card shadow="always" class="target"> <el-skeleton :rows="5" v-if="state.page === {}" /> <v-md-preview :text="md" ref="preview" ></v-md-preview> </el-card>

我按着这个改了，也没有效果，您那是可以的么

是的，我的可以

我把代码发您，可以帮忙看下么

可以

就是官网里面的代码，官网地址：https://ckang1229.gitee.io/vue-markdown-editor/zh/senior/anchor.html

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>

[yiyuqi]

需要给容器设置一个高度，锚点就可以了

[xudingjun3131]

换成这样就可以了。