关于 antd 遇到的问题

[chenqh]

<a-input-number> 在 rule 为 [{required:true}] 的时候为什么输入 0, 也会报错?

如果我既想让值是 number, 也想 required, 也想 0 也能通过改怎么办?

[dfkjgklfdjg]

没能复现，可能需要你检查一下代码，或者可以去 codepen 之类的做一个演示了。

[chenqh]

<template>
<a-modal
title="更新通道费率(统统 /1000)"
ok-text="确定"
cancel-text="取消"
width="800px"
@ok="fn_handle_ok"
v-model:visible="o_visible"
v-model:loading="o_loading"
>

<a-form ref="o_form_ref" :rules="o_form_rules" :model="o_form_model" :wrapperCol="{span: 16}" :labelCol="{span: 8}">
<a-row :gutter="[16, 16]">
<a-col xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="{span: 24}" v-for="(channel,index) in o_channel_list">
<a-form-item :label="channel.label" :name="channel.name" :key="index" >
<a-input-number v-model:value="o_form_model[channel.name]" min="-1" max="1000"></a-input-number >
<span class="ant-form-text">
‰
</span>
</a-form-item>
</a-col>
</a-row>
</a-form>

</a-modal>

</template>

<script>

import {ref} from "vue"
import {reactive} from "vue"
import { message } from 'ant-design-vue';
import {toRaw} from "vue"
import {useStore} from "vuex";
export default {
emits: [
"on-ok"
],
setup(props, {emit}) {
let o_data_ready = ref(false)
let store = useStore()
let o_visible = ref(false);
let fn_visible = o => {
o_visible.value = o;
}
let o_loading = ref(false);
let check_dev = async (rule, value) => {
if(value == '') {
return Promise.reject("请输入值")
}
return Promise.resolve(value);
}

let o_form_rules = {
dev: [{required: true, message: "请输入金额", trigger: "change"}],
}
let o_channel_list = [
{label: "dev:", name: "dev"},
{label: "mock:", name: "mock"}
]
let o_form_model = reactive({})
let o_form_ref = ref();

let fn_form_model = o => {
for(let key in o_form_rules) {
o_form_model[key] = o[key]
}
console.log("o_form_model", o_form_model);
}
let extra = {}
let fn_extra = o => {
extra = o
}
let fn_form_model_clear = () => {
fn_extra({})
for(let key in o_form_rules ) {
o_form_model[key] = 0;
}
}

let fn_handle_ok = () => {
o_form_ref.value.validate().then(async () => {
let data = Object.assign({}, extra, toRaw(o_form_model))
await store.dispatch("user/api_user_update_channel", data)
emit("on-ok")
fn_form_model_clear()
}).catch(e => {
message.error(e)
console.error(e);
})
}


// __export__
return {
o_data_ready,
o_visible,
fn_visible,
o_loading,
fn_handle_ok,
o_form_rules,
o_channel_list,
o_form_model,
fn_form_model_clear,
fn_form_model,
fn_extra,
o_form_ref,
}
// __end_export__
}
}
</script>

[chenqh]

@dfkjgklfdjg 代码是这样的, 难道是因为我放在 modal 里面的原因?还是因为子组件的原因? codepen 不会用呀,不知道怎么加载 antd

[chenqh]

知道是怎么回事了`{required: true, message: "请输入金额", trigger: "change"}` 加个 type 就好了 `{required: true, message: "请输入金额", trigger: "change", type: "number"}` 郁闷了

[c1273082756]

指定一下类型就行了, 实在不行写个自定义的 rules 就 ok 了, 想怎么定义规则就怎么定义规则, 然后返回 Promise.resolve()就 ok