vue提交表单后刷新页面
时间: 2023-06-04 20:06:01 浏览: 335
可以通过在表单提交之前使用 JavaScript 阻止默认行为,并在提交成功后手动刷新页面来实现。具体代码可以参考以下示例:
```html
<form id="myForm" action="/submit" method="post">
<!-- 表单字段 -->
<input type="text" name="username" />
<input type="password" name="password" />
<button id="submitBtn" type="submit">提交</button>
</form>
<script>
const form = document.getElementById('myForm');
const submitBtn = document.getElementById('submitBtn');
form.addEventListener('submit', (event) => {
event.preventDefault(); // 阻止默认行为
// 提交表单
submitForm().then(() => {
// 刷新页面
window.location.reload();
});
});
function submitForm() {
const formData = new FormData(form);
return fetch('/submit', { method: 'POST', body: formData });
}
</script>
```
注意:在实际项目中,应该根据接口返回的状态码或其他标识来判断提交是否成功,避免因网络或其他原因导致页面频繁刷新或无法刷新的情况。
阅读全文