nz-inpu使用readonly

`nz-input` 组件是 Ant Design of Angular 库中的一个输入框组件，可以用于接收用户输入。`readonly` 是 `nz-input` 组件的一个属性，用于设置输入框为只读，即用户不能编辑输入框中的内容。当设置 `readonly` 属性为 `true` 时，用户可以选择输入框中的内容，但不能编辑或删除。这个属性通常用于展示一些静态的文本或数据，而不需要用户进行编辑的场景。在使用 `nz-input` 组件时，如果需要设置输入框为只读，可以将 `readonly` 属性设置为 `true`，例如：

<nz-input [readonly]="true" value="这是只读输入框"></nz-input>

相关问题

el-inpu 限制输入长度

您可以使用element UI中的el-input组件和自定义验证规则来限制输入的长度。下面是一个例子：

<el-input v-model="inputValue" :maxlength="10" :rules="rules"></el-input>

data() {
  return {
    inputValue: ''
  }
},
computed: {
  rules() {
    return [
      { validator: this.checkLength, trigger: 'blur' }
    ]
  }
},
methods: {
  checkLength(rule, value, callback) {
    if (value.length > 10) {
      return callback(new Error('输入长度不能超过10个字符'))
    }
    callback()
  }
}

这将创建一个输入框，其中`maxlength`属性将限制输入的长度不超过10个字符。同时，使用自定义验证规则来检查输入的长度是否超过了限制，如果超过限制则会显示一个相应的错误提示。

el-inpu只能点击不能输入

el-input是Element UI框架中的一个输入框组件，它提供了用户输入数据的功能。但是，在某些情况下，我们可能希望将el-input设置为只能点击而不能输入文字。

要实现这个功能，我们可以借助Element UI提供的属性和方法来处理。首先，我们可以使用readonly属性将el-input设置为只读。

在模板中，我们可以这样使用el-input组件并设置readonly属性：

<el-input readonly></el-input>

这样，el-input就会变成只读输入框，无法进行文本输入。然而，这只是让输入框无法手动输入文本，但仍然可以通过编程的方式来改变输入框的值。如果我们希望完全禁用输入功能，不仅仅是禁止手动输入，我们可以结合使用readonly属性和:clearable属性。

<el-input readonly :clearable="false"></el-input>

通过设置clearable属性为false，我们不仅禁止了手动输入，还禁止了输入框中的清空按钮。这样，el-input就只能通过其他方式来改变其值，而不能通过点击或手动输入。

总结起来，要让el-input只能点击而不能输入，我们可以使用readonly属性将其设置为只读，或者结合使用readonly和:clearable属性来完全禁用输入功能。这样，我们可以控制el-input的行为，实现我们需要的功能。