最近正好遇到一个问题,修改用户的头像,修改后再进入用户主页,发现改了之后即使数据变了。。
页面
也不会重新渲染。。。
下面提供几种解决方案来给予大家参考:
1. 可以在
刷新
的
页面
定义一个
参数
, 这样每次都会渲染出不同的
页面
:
route 实例化命名配置:
// 用户信息
path: '/accountDetail/:randKey',
name: 'accountDetail',
component: accountDetail,
meta: {requiresAuth: true}
跳转 的地方配置:
var chars = ['0', '1', '
path: 'data-detail-edit/:type',
component: () => import('@/views/cost/costDetail/index'),
name: 'test1'
params: { type: 1 },
iview中的input表单中输入的数据
刷新
后不会被清除的方法
表单中的数据填写到一半
刷新
网页的话会清楚里面已经储存的数据,这样的体验对于用户来说很不好,此篇文章是在
vue
中使用了iview中input组件,通过sessionStorage这个对象来优化。
选择的是sessionStorage,选择的原因
vue
是单
页面
应用,操作都是在一个
页面
跳转
路由
,另一个原因是sessionStorage可以保证打开
页面
时sessionStorage的数据为空,而如果是localStorage则会读取上一次打开
页面
的数据
一 新建editRouteQuery.js文件
//共接收2个
参数
route对象,
参数
对象
参数
值需为null
export const editRouteQuery = (route, query = null) => {
const _old = route.query
let _new = query
if (query) {
_new = Object.assign({}, _old, query)
for (let
出现这种情况是因为依赖
路由
的params
参数
获取写在created生命周期里面,因为相同
路由
二次甚至多次加载的关系 没有达到监听,退出
页面
再进入另一个文章
页面
并不会运行created组件生命周期,导致文章数据还是第一次进入的数据。
解决方法:watch监听
路由
是否变化
watch: {
// 方法1
'$route' (to, from) { //监听
路由
是否变化
将
vue
x中的数据缓存到浏览器即可保证
刷新
页面
vue
x不回被清空
首先缓存state中的数据,在app.
vue
中添加
mounted中添加监听unload事件,当
页面
刷新
的时候缓存数据:
window.addEventListener('unload', this.saveState)
method中添加方法:
saveState() {
sessionStorage.setItem('state', JSON.stringify(this.$store.state))
对于循环出来的列表,会出现
删除
的按钮,
删除
当前的一条数据
思想:点击当前的
删除
按钮事件时,需要把当前的index传入
点击的时用splice
删除
数据的index,
删除
当前一条即可
splice:方法可
删除
从 index 处开始的零个或多个元素,并且用
参数
列表中声明的一个或多个值来替换那些被
删除
的元素。
demo:
v-for="(list,listindex) in