点击新建按钮，报错

[www311]

点击新建按钮，报错如下，哪里用的不对吗？

<template>
    <div>
        <s-button type="primary" icon="plus" on-click="toAdd">新建</s-button>

        <s-modal
            title="用户"
            visible="{=visible=}"
            on-ok="handleNewSubmit"
            cancelText="重置"
            on-cancel="handleNewCancel"
        >
            <s-form s-ref="form">
                <s-formitem label="邮箱前缀">
                    <s-input decorator="{{decorators.username}}" placeholder="请输入邮箱前缀" />
                </s-formitem>
            </s-form>
        </s-modal>
    </div> 
</template>

<script>
    import san from 'san';
    import {
        Table,
        Button,
        Icon,
        Tooltip,
        Dropdown,
        Menu,
        Modal,
        Input,
        Form,
        Alert,
        Tree,
        Row,
        Col,
        Affix,
        message,
        Select,
        Radio
    } from 'santd';

    export default {
        components: {
            's-form': Form,
            's-formitem': Form.FormItem,
            's-row': Row,
            's-col': Col,
            's-table': Table,
            's-button': Button,
            's-icon': Icon,
            's-dropdown': Dropdown,
            's-tooltip': Tooltip,
            's-menu': Menu,
            's-menu-item': Menu.Item,
            's-modal': Modal,
            's-input': Input,
            's-textarea': Input.TextArea,
            's-alert': Alert,
            's-tree': Tree,
            's-tree-node': Tree.TreeNode,
            's-affix': Affix,
            's-select': Select,
            's-select-option': Select.Option,
            's-radio': Radio,
            's-group': Radio.Group,
        },
        initData() {
            return {
                decorators: {
                    username: {
                        name: 'username',
                        rules: [
                            {
                                required: true,
                                message:`请输入username`
                            },
                        ],
                    }
                },
                visible: false,
            };
        },

        handleNewCancel(e) {
            const form = this.ref('form').form;
            console.log(form)
            form.resetFields();
        },

        handleNewSubmit(e) {
            const form = this.ref('form').form;
            console.log(form)
            form.resetFields();
        },

        toAdd() {
            this.data.set('visible', true);
        },
        
    };
</script>

[Lohoyo]

让我看看

[Lohoyo]

你没有使用 Form.create 包装组件。