84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
我正在使用Vue.js和Vuetify。遇到了一个有趣的场景。 所以我有三个选项（单选按钮）
我有一个带有特定文本值和只读属性的v-text-field。 现在，当选项改变/选择时，我想要改变该文本在v-text-field内的位置。
例如，当选项1（左）时，文本应该移动到v-text-field内的左侧。当选项2（中）时，文本应该移动到中间。依此类推。
对此有什么建议。如果有更好的方法，请指导一下。
你可以使用Vue中的class或style绑定
data() { return { activeAlignment: 'center' } }
点赞+0 添加回复 关闭回复 P粉041856955 回复
您可以创建类并将它们绑定：
new Vue({ el: '#app', vuetify: new Vuetify(), data: () => ({ text: 'some text', align: '' }) })
.left .v-text-field__slot textarea, .left .v-text-field__slot input { text-align: left; } .center .v-text-field__slot textarea, .center .v-text-field__slot input { text-align: center; } .right .v-text-field__slot textarea, .right .v-text-field__slot input { text-align: right; }
左对齐 居中对齐 右对齐
你可以使用Vue中的class或style绑定
data() { return { activeAlignment: 'center' } }您可以创建类并将它们绑定：
new Vue({ el: '#app', vuetify: new Vuetify(), data: () => ({ text: 'some text', align: '' }) }).left .v-text-field__slot textarea, .left .v-text-field__slot input { text-align: left; } .center .v-text-field__slot textarea, .center .v-text-field__slot input { text-align: center; } .right .v-text-field__slot textarea, .right .v-text-field__slot input { text-align: right; }