通过ref获取dom时,问题记录 获取dom方式
vue js
const ImagesRef = ref<HTMLElement>()
html - jsx
<div ref={ImagesRef}></div>
以上定义了ref获取值为HTMLElement类型,即 ImagesRef.value 的类型为 HTMLElement类型。
注:ref的括号中不填写任何东西
修改dom的属性时,style 在HTMLElement类型下属于只读属性
webstrom下会提示
Cannot assign to 'style' because it is a read-only property.
Attempt to assign to const or readonly variable
解决方案 应使用setAttribute修改style属性
ImagesRef.value.setAttribute(`style`, `transform:translateY(100px)`)
开发components
在 3.x 中,自定义组件上的 v-model 相当于传递了 modelValue prop 并接收抛出的 update:modelValue 事件:
通过v-model:做双向绑定
<ChildComponent :modelValue="pageTitle" @update:modelValue="pageTitle = $event" />
简化写法