created 初始化数据的问题

created生命周期钩子是在Vue实例被创建后、数据观察和事件初始化之前调用的。将getList()获取数据方法放在created生命周期有以下几点考虑

1.created 钩子是在实例被创建后立即调用的，因此适合用于初始化数据。在 created 钩子中调用 getList() 可以确保在组件实例创建时就获取初始的消息列表。

2.及早获取数据： 在 created 钩子中调用 getList() 使得组件在挂载之前就能获取到必要的数据。这样可以避免在组件挂载后再去请求数据，从而提高用户体验，因为组件在挂载时已经有了初始数据。

3.避免重复代码： 如果多个生命周期钩子中都需要调用 getList() 方法，将其放在 created 中可以避免重复代码，使代码更清晰和易维护。

遇到的问题：当切换不同设备型号时获取到的数据还是原设备型号的数据

原因：getList() 方法将不会在 this.deviceInfo.DEVICE_TYPE 改变时自动调用的原因涉及到Vue.js的响应式系统和生命周期钩子。在Vue.js中，数据的变化可以触发视图的更新，但这种响应式是基于Vue能够追踪数据的变化。在 created 生命周期钩子中调用 getList() 方法确保了在组件创建时就获取了一次消息列表。然而，如果 deviceInfo.DEVICE_TYPE 后来发生了变化，Vue.js 默认情况下并不会自动检测到这个变化并触发对应的更新。

解决方案：

使用 watch 部分监视 device_change 允许在 deviceInfo.DEVICE_TYPE 发生变化时主动调用 getList() 方法，从而手动触发对应的操作。Vue.js的 watch 选项提供了一种监听数据变化并执行特定逻辑的方式。

所以，如果没有在 watch 中监听 device_change，那么 getList() 方法将仅在组件创建时调用，不会随着 deviceInfo.DEVICE_TYPE 的变化而自动触发。