vue+element input标签变为正方形盒子

要将Vue中的Element UI的`<el-input>`标签变为正方形盒子，你可以使用自定义CSS样式来实现。下面是一个示例代码：

<template>
  <div class="square-input">
    <el-input v-model="inputValue" placeholder="请输入内容"></el-input>
  </div>
</template>

<style scoped>
.square-input {
  display: inline-block;
}

.square-input .el-input {
  width: 100px;
}

.square-input .el-input__inner {
  border-radius: 0;
}

.square-input .el-input__inner::-webkit-input-placeholder {
  border-radius: 0;
}

.square-input .el-input__inner::-moz-placeholder {
  border-radius: 0;
}

.square-input .el-input__inner:-ms-input-placeholder {
  border-radius: 0;
}

.square-input .el-input__inner::placeholder {
  border-radius: 0;
}
</style>

在这个示例中，我们首先将`<el-input>`标签包裹在一个自定义的div容器中，然后使用CSS样式来控制该容器的显示和宽度。通过设置宽度为100px，我们将输入框变为一个正方形盒子。接下来，我们使用CSS样式来去除输入框的圆角边框，并将placeholder的圆角边框也设置为0，从而确保整个输入框都是正方形的。

通过为这个自定义的组件添加类名`.square-input`，我们可以将样式限定在这个组件的范围内（使用了`scoped`关键字），避免对其他组件产生影响。

希望这个示例能满足你的需求！如有任何问题，请随时提问。