Create a Module Configuration Item

Create a String Configuration Item

To create a string type configuration item, you can use the createStringProp function. Below is an example of a string configuration item:

createStringProp({
    component: 'PropString',
    field: 'field1',
    label: 'label field1',
    defaultValue: ''
});

In this configuration, PropString is a Vue component that you need to develop yourself, or you can use the following example code as a reference:

import { usePropsFormModel, configProps } from '@ptahjs/creative-vue';

export default {
    name: 'PropString',
    props: configProps,
    setup(props) {
        const [model] = usePropsFormModel(props);
        return () => <input v-model={model.value} placeholder={props.config.placeholder} />;
    }
};

Why Do Configuration Items Need to Be Developed by Yourself?

Different projects' UI components might have different implementations and styles. To ensure compliance with the design standards of each project, we encourage developers to create and customize these configuration item components. This approach not only allows developers to make adjustments according to project requirements but also ensures consistency and unity.

By doing so, you can:

• Adapt to Specific Needs: Customize configuration items according to the UI component requirements of the project to meet specific design standards.
• Increase Flexibility: Allow developers to better adapt to the changing needs of the project.
• Optimize User Experience: Continuously improve and optimize configuration item components based on user feedback and requirements.

This customizable approach provides developers with more creative freedom and flexibility, allowing each project’s UI components to meet its precise requirements.