vue中button点击提交后关闭当前页面，然后居中提示注册成功

可以通过以下代码实现：

<template>
  <div>
    <button @click="submit">提交</button>
  </div>
</template>

<script>
export default {
  methods: {
    submit() {
      // 提交逻辑
      // ...

      // 关闭当前页面
      window.close();

      // 居中提示注册成功
      alert('注册成功');
    }
  }
}
</script>

相关问题

vue中如何让el-button中的文字居中

可以使用CSS样式来实现el-button中的文字居中，具体方法如下：

1.在el-button的外层包裹一个div，设置这个div为flex布局，并且设置justify-content和align-items属性为center，这样就可以让el-button中的文字水平和垂直都居中了。

2.可以直接给el-button设置text-align:center属性，这样就可以让文字水平居中了。

示例代码如下：

1.使用flex布局

<div style="display:flex;justify-content:center;align-items:center;">
  <el-button>按钮</el-button>
</div>

2.使用text-align:center属性

<el-button style="text-align:center;">按钮</el-button>

vue dialog 页面居中

在Vue中实现对话框页面居中有多种方法，以下是其中一种常见的实现方式：

1. 首先，在Vue组件中创建一个对话框组件，可以使用第三方库如Element UI或者自定义组件。
2. 在对话框组件的样式中，设置其为绝对定位，并将left和top属性设置为50%，同时使用transform属性将其平移至屏幕中心。
3. 在对话框组件的父组件中，使用条件渲染的方式控制对话框的显示与隐藏。
4. 在父组件中，使用CSS的flex布局或者其他方式将对话框组件居中显示。

下面是一个示例代码：

<template>
  <div class="parent">
    <button @click="showDialog">打开对话框</button>
    <dialog-component v-if="isDialogVisible" @close="closeDialog"></dialog-component>
  </div>
</template>

<script>
import DialogComponent from './DialogComponent.vue';

export default {
  components: {
    DialogComponent,
  },
  data() {
    return {
      isDialogVisible: false,
    };
  },
  methods: {
    showDialog() {
      this.isDialogVisible = true;
    },
    closeDialog() {
      this.isDialogVisible = false;
    },
  },
};
</script>

<style scoped>
.parent {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.dialog-component {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
</style>

在上述示例中，点击按钮会触发`showDialog`方法，将`isDialogVisible`设置为true，从而显示对话框组件。对话框组件的样式使用绝对定位，并通过设置left和top属性为50%，使用transform属性将其居中显示。父组件使用flex布局将对话框组件居中显示。