首页 > 解决方案 > ipyvuetify:如何限制 TextField 的宽度

问题描述

我正在尝试使用ipyvuetify文本字段来设置一位数,但不能将文本字段的 with 限制为任何合理的值。一个简单的代码,例如

import ipyvuetify as v
#Textfield should be an one digit number...
v.Row(children=[v.TextField(type="number"), v.Html(tag='H1',children=['Some text here'])])

结果是一个看起来很难看的巨大 TextField: 在此处输入图像描述

如何为 TextField 的宽度设置一些限制/设置它以使其具有一个字符的最大宽度?或者,我可以在 vue v-TextField / vue 代码上设置任何属性来限制 TextField 的大小吗?

标签: pythonvuetify.jsipyvuetify

解决方案


我认为您不能直接限制 的宽度Textfield,它将采用其父元素的最大宽度。

但是你可以把它放在一个宽度固定的父元素中:

v.Row(
    children = [
        v.Html(
            tag = 'div',
            style_ = 'width: 500px',
            children = [
                v.TextField(type = "number")
            ]
        ),
        v.Html(
            tag = 'H1',
            children = ['Some text here']
        )
    ]
)

推荐阅读