说说
const
,let
,它们的区别及使用场景?
const
声明不可变的常量,必须进行初始化
let
声明可变的常量,可以不初始化,但访问前必须赋值你知道
style
加scoped
属性的用途和原理吗?
通过添加scoped
属性来使样式具有局部作用域,即只在当前组件中生效。这样做的主要目的是避免样式污染和提高样式的可维护性。
Vue
会为每个作用域CSS
生成一个唯一的类名,并将这个类名添加到组件的根元素上。这样一来,该组件内部的样式规则就只会应用到带有该类名的元素上,从而实现了样式的局部作用域。v-show
和v-if
有什么区别?使用场景分别是什么?
v-show
display
属性切换元素的可见状态,适用于频繁切换显示和隐藏的情况
v-if
动态的添加或移除元素,适用于在运行时条件不经常改变的情况下,或者条件渲染的元素包含大量子组件或复杂的初始化逻辑v-for
循环中key
有什么作用?
正确地跟踪输入控件的状态,防止出现状态错乱或重置的问题
更新时提高性能说说
watch
和computed
?
computed
适用于计算基于响应式数据的衍生属性(如计算总价、格式化日期),它具有缓存特性,只在依赖的响应式数据发生变化时才会重新计算。
watch
适用于监听指定的响应式数据的变化,并在数据变化时执行相应的操作,它更通用,可以监听任意数据的变化,并执行自定义的回调函数(异步操作、复杂逻辑处理或多个数据之间的交互)。
nextTick
有什么作用?什么场景下可以用到?
修改了组件的数据时,Vue
会异步地去更新DOM
,如果希望在更新完成后执行一些操作,就可以使用Vue.nextTick()
来确保在DOM
更新后再执行你的代码Vue3
的使用情况,其setup
是什么作用?
为组件提供了一个清晰、统一的入口点,使得组件的逻辑更易于理解和维护。
为 函数式组件或Composition API
风格的组件 提供一个地方来进行组件的初始化工作,包括响应式数据、计算属性、方法、生命周期钩子等。vue-router
路由有几种模式?说说它们的区别?
Hash
模式
History
模式for in
遍历对象,是按什么顺序遍历的?如何保证顺序?