select中option公共数据模块js导出

GJF_blog

已于 2024-03-01 17:54:47 修改

阅读量134

点赞数 1

文章标签： javascript 开发语言 ecmascript

于 2024-03-01 17:53:47 首次发布

本文链接：https://blog.csdn.net/GJF_blog/article/details/136402596

版权

第一种方法（模块中的多个导出）

/**
 * @see 引入:import { sendTypeList, taskTypeList } from "./common";
 * @see 使用:sendTypeList,taskTypeList
 */
export const sendTypeList = [
    {
      label: '邮件',
      value: 3
    }
]
export const taskTypeList = [
    {
      label: '备份',
      value: 0
    }
]

第二种方法（和第一种基本一样）

/**
 * @see 引入:import { selectOptionsTwo } from "./common";
 * @see 使用:selectOptionsTwo.sendTypeList,selectOptionsTwo.taskTypeList
 */
export const selectOptionsTwo = {
    sendTypeList: [
        {
            label: '邮件',
            value: 3
        },
    ],
    taskTypeList: [
        {
            label: '备份',
            value: 0
        },
    ]
};

第三种方法混合导出（模块的默认导出和其他导出）

/**
 * @see 引入:import defaultExport, { export1, export2 } from "./common";
 * @see 使用: defaultExport(), export1, export2
 */
const export1 = 'This is export1';
const export2 = 'This is export2';

function defaultExport() {                      
console.log('This is the default export');
}

export { export1, export2 };
export default defaultExport;

第四种方法（导入整个模块的内容）

/**
 * @see 引入:import * as moduleName from './common'
 * @see 使用:moduleName.文件中所有导出的内容 moduleName.myVariable, myVariable.myFunction, ...
 */
export const myVariable = 1;
export function myFunction() {}
export class MyClass {}
export const foo = [];

第五种方法

/**
 * selectOptionsData 自定义名称
 * @see 引入:import CMJS from "./common";
 * @see 使用:CMJS.sendTypeList,CMJS.taskTypeList
 */
class SelectOptionsCommon {
    constructor() {
        this.sendTypeList = [
            {
                label: '邮件',
                value: 3
            },
        ],
        this.taskTypeList = [
            {
                label: '备份',
                value: 0
            },
        ]
    }
    init = () => {
        return [];
    };
}
export default new SelectOptionsCommon();