uniapp跳转页面动画

今天修改了一个app内点击跳转画面过于生硬的问题

场景：点击切换后画面会先白一下再跳转

首先用的是uni.reLaunch()方法跳转的

methods: {
      asdsa(event) {
        uni.reLaunch({
          url:'/跳转的路径'
        })
      }
    }

uni.reLaunch()可以在退出登录时使用，跳转到某个页面或者异常退出时使用

但它有一个缺点，跳转页面动画不能更改，只能使用默认样式，导致无法实现想要的效果

解决：

可以使用uni.navigateTo()方法实现跳转动画的样式修改

保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。

asdsa(event) {
	uni.navigateTo({
	    url: '/跳转的路径'
	})
}

uni.navigateTo()的参数说明

修改显示动画参数：

 

 如何使用：

API形式使用：

uni.navigateTo({
	url: '../test/test',
	animationType: 'pop-in',
	animationDuration: 200
});

组件形式使用：

navigator
navigator

在pages.json中配置

"style": {
	"app-plus": {
		"animationType": "fade-in",
		"animationDuration": 300
	}
}

配置完成后可明显看出显示动画效果