作者: chenjieyi | 来源:发表于2019-04-22 17:00 被阅读0次

    日常用法
    <fieldset disabled>
    常用于控制表单的不可编辑,fieldset元素设置disabled,其内的表单元素都会被设置为disabled状态,并且拦截表单的键盘事件,如回车提交表单。通常还结合css的:disabled设置表单disabled状态的样式
    使用场景:当表单为编辑,查看的共用组件,那么仅仅只是查看表单详情时,可在fieldset元素添加属性disabled。

          <Form>
            <fieldset disabled>
              <FormItem label="用户名" {...formItemLayout}>
                <Input placeholder="请输入用户名" />
              </FormItem>
              <FormItem label="邮箱" {...formItemLayout}>
                <Input type="email" placeholder="请输入正确的邮箱格式,如:xxx@qq.com" />
              </FormItem>
              <FormItem label="网址" {...formItemLayout}>
                <Input placeholder="请输入真实的网址" />
              </FormItem>
            </fieldset>
          </Form>
    
      // 样式
        input {
          &:disabled {
            background: #eee;
            cursor: not-allowed;
          }
        }
    
    效果图

    相关文章

      网友评论

          本文标题:

          本文链接:https://www.haomeiwen.com/subject/hdcugqtx.html