如何在Svelte中获取div的偏移宽度？
在Svelte中获取div的偏移宽度，可以使用JavaScript的DOM操作来实现。具体步骤如下：
- 首先，在Svelte组件中，使用
ref指令给目标div元素添加一个引用。
<script>
let divRef;
function getOffsetWidth() {
if (divRef) {
const offsetWidth = divRef.offsetWidth;
console.log('偏移宽度：', offsetWidth);
}
}
</script>
<div ref={divRef}>
<!-- div的内容 -->
</div>
<button on:click={getOffsetWidth}>获取偏移宽度</button>- 在
getOffsetWidth函数中，通过divRef.offsetWidth获取div元素的偏移宽度，并进行相应的操作。
这样，当点击按钮时，就会调用getOffsetWidth函数，并在控制台输出div元素的偏移宽度。
请注意，以上代码只是一个示例，实际应用中可能需要根据具体情况进行适当的修改和扩展。
关于Svelte的更多信息和相关产品介绍，您可以参考腾讯云的官方文档：
相关·内容
2回答
我正在与Svelte一起工作，我想问一下如何获得div的偏移宽度的值？这是我的代码 <script> let divWidth;</script>
<style>
浏览 34提问于2021-06-22得票数 1
1回答
菜谱有一个默认的服务编号(例如:4个人)。用户可以更改服务以动态更新菜谱的比例。
当使用servings @urql/svelte**?**获取变量时，如何在Svelte中这样做？在收到Svelte中的数据后，我的想法是基于获取的defaultServings值创建一个servings变量。defaultServings不应该更新。然后，我将计算每个成分
浏览 1提问于2022-02-14得票数 2
我只能在display中使用div标记，如在 post响应中提到的那样 import Viewport from 'svelte-viewport-info' only visible in Portrait Mode
浏览 8提问于2022-02-04得票数 0
回答已采纳
2回答
我试图将表格单元格的宽度作为支柱传递给其中的组件： <NestedComponent cellWidth={cellWidth} />然后，在嵌套的组件中，我试图通过一个lyfecycle方法来访问它，但是它记录为未定义的import { afterUpdat
浏览 6提问于2021-08-31得票数 0
回答已采纳
我有一个正在运行的sveltekit页面，它让您指定一个同级页面+page.ts，在其中调用load方法来获取数据。但是，我希望基于+page.svelte中的按钮或交叉点观察者分页。是否必须重写要在+page.svelte中使用的函数？或者，我是否可以在page.ts文件中使用它，并使用+page.svelte中不同的偏移量/etc调用它？文档不会显示这个特定的用例。
浏览 7提问于2022-11-18得票数 0
回答已采纳
我正在创建一个不使用JQuery的AngularJS站点。在指令中，传递的值为 return { }html看起来像这样：
<div class="aside" moving-
浏览 3提问于2013-09-17得票数 3
如何在距顶部特定偏移量(或垂直居中)的另一个div中水平居中可变宽度的div？一个额外的条件是，只有div的可见部分必须拦截鼠标事件--这限制了一些选项。+--------------+| <innner> +inner包含可单击的元素，并且必须位于堆叠顺序的</e
浏览 2提问于2014-01-08得票数 0
我在斯维特有一个基本的布局。它由两根柱子组成:左边是深紫色的，右边是淡灰色的。左边的列有固定的宽度，用户可以使用红色按钮打开和关闭它，右边的列占用剩余的空间。对此，我用：bind:clientHeight={height}
我需要维度，因为在正确的列中，我必须添加一个新组件(Core)，使用该值进行一些昂贵的计算问题是，当用户更改窗口大小、
浏览 3提问于2022-09-27得票数 0
回答已采纳
2回答
我对svelte环境非常陌生，我有一些反应代码，为了学习目的，我尝试将它们转换为svelte。key="1" {/** some code **/} 我试图在svelte中使用相同的
浏览 0提问于2021-06-05得票数 8
回答已采纳
我正在学习Svelte，我想在三个组件中使用来自一个JSON的数据。onMount在App.svelte主组件中检索数据，这很好。为了说明我的问题，在Stats.svelte中，我试图显示每个时间段的百分比值，例如：
当前年度: 100 %持续30天:93%持续100天: 92%all time: 92%<code>F 217</stats对象确实是从父组件App.svelte传入的，如果
浏览 2提问于2021-01-11得票数 1
回答已采纳
我正在使用一个外部库(@shopify/ Draggable )，我想告诉draggable当前组件中可拖动CSS类的名称是什么。}); .draggable { ... }
</style> 我知道我可以使用once CSS选择器来告诉Svelte类名是全局的，但是有没有办法反其道而行之，并询问Svelte如何将本地draggable CSS类重命名为once global？例
浏览 59提问于2021-01-02得票数 0
1回答
有一种从父作用域中获取子组件实例引用的简单方法，如所示。
我想要的是从组件本身中获取对组件的引用。因此，如果我们查看上面链接的官方Svelte演示，我的意思是我希望从InputField实例中引用InputField实例，而不是从App.svelte中引用。(我想这样做的原因是:我需要实例来激发外部JS库的钩子，这些库将以编程方
浏览 2提问于2021-11-24得票数 3
回答已采纳
我注意到，如果一个对象或数组作为prop传入，那么当子组件中的任何元素发生更改时，这些更改都会反映在父组件中的原始对象或数组中。看起来双向绑定已经发生了。那么有没有理由对对象或数组使用绑定呢？
浏览 16提问于2021-11-08得票数 2
我想知道是否可以使用变量和未知数量的单元格创建网格，以便： gridTemplateColumns: `repeat(auto-fit, minmax(200px, 1fr))`,
单元格将始终填充到容器的边缘正确，但如果您只有一个单元格
浏览 4提问于2021-11-08得票数 0
1回答
当我的内容中有太多的文本时，这个问题就会发生，它会将conent向下推。我不确定我是不是把事情安排得很好。这是我的HTML <div class="col-sm-4" > </div>
浏览 0提问于2013-11-13得票数 0
回答已采纳
2回答
在斯维特传递道具
、、
我正在尝试使用Svelte、Svelte路由和Firestore来实现一个相当标准的博客应用程序，但我想我误解了道具如何在组件之间传递的一个基本部分。我将我的初始代码建立在Fireship.io上的优秀教程之上--它按照教程：工作。<Router url="{url}">
&l
浏览 2提问于2019-06-23得票数 3
回答已采纳
为什么svelte声明了未使用的CSS选择器，而我的组件中可能有内部元素？<div class="users"> <User name={id} /></div>
margin-right: 5px;</style>
错误：Un
浏览 6提问于2021-10-29得票数 0
回答已采纳
3回答
我想知道如何从Svelte的函数中转发一个事件。所以我也可以从App.svelte文件中获取事件 import Button from './component.svelte&
浏览 1提问于2020-10-10得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
