1. 使用 uni.reload()
方法
适用场景:需要更新数据和重新渲染页面的情况。
使用方法:
- 在页面中添加一个按钮或其他触发元素,绑定点击事件。
- 在点击事件的处理函数中调用
uni.reload()
方法。
示例代码:
html复制代码
|---|-----------------------------------------------|
| | <template>
|
| | <view>
|
| | <button @click="refreshPage">刷新页面</button>
|
| | </view>
|
| | </template>
|
| | |
| | <script>
|
| | export default {
|
| | methods: {
|
| | refreshPage() {
|
| | uni.reload(); // 刷新当前页面
|
| | }
|
| | }
|
| | }
|
| | </script>
|
2. 使用 location.href
属性
适用场景:修改URL地址实现重新加载当前页面。
使用方法:
- 类似于
uni.reload()
,也是在点击事件的处理函数中操作。 - 但这里是通过将
location.href
设置为当前页面的URL地址来实现页面刷新。
示例代码:
html复制代码
|---|-----------------------------------------------|
| | <template>
|
| | <view>
|
| | <button @click="refreshPage">刷新页面</button>
|
| | </view>
|
| | </template>
|
| | |
| | <script>
|
| | export default {
|
| | methods: {
|
| | refreshPage() {
|
| | location.href = location.href; // 重新加载当前页面
|
| | }
|
| | }
|
| | }
|
| | </script>
|
3. 使用 this.onLoad()
或 this.onReady()
/ this.onShow()
适用场景:
this.onLoad()
适用于本次操作对页面onLoad
函数所携带的各种参数没有影响的情况。this.onReady()
或this.onShow()
适用于需要在页面加载完成或显示时执行某些操作的情况。
使用方法:
this.onLoad()
:在操作函数中调用,并传入之前保存的options
参数(如果有的话)。this.onReady()
或this.onShow()
:在操作函数中直接调用,但需要注意它们的使用前提。
注意 :使用 this.onLoad()
或 this.onReady()
/ this.onShow()
并不是真正的"刷新"页面,而是重新执行了页面的某些生命周期函数。因此,它们更适用于在特定情况下重新加载页面数据或执行某些操作,而不是简单地刷新整个页面。