小编cry*_*nix的帖子

如何通过扩展基类表单来动态地使用ES6创建此表单?

我想在JS中创建表单,就像它们继承一样...例如,我可以使用for循环轻松地整天添加表单元素,但我宁愿让自己自由地插入不同的元素中间.换句话说,我希望它是"模块化的",并且有一个基类可以生成像登录屏幕一样简单的东西,但是然后扩展它以包括文本字段之间的下拉列表.关于如何实现这一点的任何想法?最好是ES6类和导入/导出,没有webpack废话.理想情况下我不得不称为类BasicForm和有RegistrationForm extends BasicForm.这样,我可以简单地将字段名称存储在数组中,如果我需要进行更改而不是更改所有内容,则可以更改该文件一次.这是现有的代码....请注意,只有选择的用户角色选项是"admin"....才会显示"发票".这使得我想要理解这一点非常困难.有没有办法通过引导程序和自定义类在程序上生成使用ES6类的Javascript,这样可以重用模块来创建有或没有下拉列表的表单?

HTML:

<div class= "row">  <!--Inherits background from .body-->
    <div class="col-hidden col-sm col-md col-lg col-xl">     <!--spacing divs inherit background from .body-->
        &nbsp;
    </div>
    <div class="form-box rounded col-12 col-xs col-sm-7 col-md-6 col-lg-4 col-xl-3">  <!--Actual box containing fields and prompts and buttons changes to new background-->
        <h2 class="portal-heading">Registration</h2>
        <form name="new_user_form">
            Email Address<input type="text" class="form-control register-field highlight-hover" name="email" value="" placeholder="Email Address"><br>
            Re-Enter Email Address<input type="text" class="form-control register-field highlight-hover" autocomplete="off" name="email" value="" placeholder="Re-enter Email Address"><br>
            First Name<input type="text" …
Run Code Online (Sandbox Code Playgroud)

forms inheritance prototypal-inheritance dynamically-generated es6-class

5
推荐指数
1
解决办法
270
查看次数