欢迎光临
我们一直在努力

vue 的常见指令 vue 的生命周期 bean 的作用域

一、Vue 常见指令

指令:以 v- 开头,给标签添加特殊行为

表格

指令作用
v‑text 设置元素文本内容
v‑html 渲染 html 文本
v‑if / v‑else‑if / v‑else 条件渲染(销毁 / 创建元素)
v‑show 显示隐藏(切换 display:none,元素一直存在)
v‑for 列表循环遍历 v-for="item in list"
v‑bind / : 绑定属性(src、class、style)
v‑on / @ 绑定事件,@click、@input
v‑model 双向数据绑定(表单输入框)
v‑once 元素只渲染一次

高频面试区分:v‑if 销毁重建;v‑show 只是 css 隐藏;频繁切换优先用 v‑show

二、Vue 生命周期(8 个钩子函数)

生命周期:Vue 实例从创建 → 挂载 → 更新 → 销毁全过程

创建阶段(实例刚创建,DOM 还没有)

  • beforeCreate:实例初始化,data/methods 访问不到
  • created:✅最常用,data、方法已就绪;DOM 未生成,不能操作页面;适合发初始 ajax 请求
  • 挂载阶段(渲染 DOM)

  • beforeMount:模板编译完成,DOM 还没渲染到页面
  • mounted:✅最常用,DOM 渲染完毕;可以操作页面 dom 元素
  • 更新阶段(数据改变,页面刷新)

  • beforeUpdate:数据更新后,页面还没刷新
  • updated:数据和页面全部更新完成
  • 销毁阶段

  • beforeUnmount(vue3) / beforeDestroy(vue2):实例销毁前,还能访问数据 dom;适合清除定时器、解绑事件
  • unmounted(vue3) / destroyed(vue2):实例销毁完成
  • 口诀:创前创,挂前挂,更前更,销前销

    三、Spring Bean 的作用域

    1. singleton(单例)⭐默认

    • IOC 容器启动就创建唯一 1 个实例对象
    • 每次获取 bean 拿到同一个对象地址
    • Controller、Service、Mapper 默认都是单例
    • 风险:单例 bean 中不要定义成员变量,线程不安全
    • 搭配@Lazy:延迟初始化 → 第一次使用 bean 的时候才创建对象

    2. prototype(多例)

    • 容器启动不会创建对象
    • 每次 getBean 获取,都会 new 一个全新对象
    • 每次打印对象地址都不一样;天然线程安全

    其余较少见作用域(web 项目)

    • request:一次 http 请求一个 bean
    • session:一次会话一个 bean

    设置多例代码:

    @Component
    @Scope("prototype")
    public class Demo{
    }

    赞(0)
    未经允许不得转载:171主机测评 » vue 的常见指令 vue 的生命周期 bean 的作用域
    分享到: 更多 (0)

    评论 抢沙发

    • 昵称 (必填)
    • 邮箱 (必填)
    • 网址