Uniform iView tag writing specification, all tags can be used in the form of capital letters, including two tags Switch and Circle that are restricted by Vue.
Although not recommended, you can use the loader option configuration to open all tag prefixes, such as i-date-picker.
First, install iview-loader through npm
npm install iview-loader --save-dev
Configure webpack to rewrite the normal vue-loader configuration, such as:
module: { rules: [ { test: /\.vue$/, use: [ { loader: 'vue-loader', options: { } }, { loader: 'iview-loader', options: { prefix: false } } ] } ] }
- You can write
<Switch>and<Circle>tags now. - After the parameter
prefixis set totrue, all iView component tag names can be prefixed, such as<i-row>and<i-select>.
The following is the complete tag name:
{ 'i-affix': 'Affix', 'i-alert': 'Alert', 'i-auto-complete': 'AutoComplete', 'i-avatar': 'Avatar', 'i-back-top': 'BackTop', 'i-badge': 'Badge', 'i-breadcrumb': 'Breadcrumb', 'i-breadcrumb-item': 'BreadcrumbItem', 'i-button': 'Button', 'i-button-group': 'ButtonGroup', 'i-card': 'Card', 'i-carousel': 'Carousel', 'i-carousel-item': 'CarouselItem', 'i-cascader': 'Cascader', 'i-checkbox': 'Checkbox', 'i-checkbox-group': 'CheckboxGroup', 'i-circle': 'i-circle', 'i-col': 'Col', 'i-collapse': 'Collapse', 'i-color-picker': 'ColorPicker', 'i-date-picker': 'DatePicker', 'i-dropdown': 'Dropdown', 'i-dropdown-item': 'DropdownItem', 'i-dropdown-menu': 'DropdownMenu', 'i-form': 'Form', 'i-form-item': 'FormItem', 'i-icon': 'Icon', 'i-input': 'Input', 'i-input-number': 'InputNumber', 'i-menu': 'Menu', 'i-menu-group': 'MenuGroup', 'i-menu-item': 'MenuItem', 'i-submenu': 'Submenu', 'i-modal': 'Modal', 'i-option': 'Option', 'i-option-group': 'OptionGroup', 'i-page': 'Page', 'i-panel': 'Panel', 'i-poptip': 'Poptip', 'i-progress': 'Progress', 'i-radio': 'Radio', 'i-radio-group': 'RadioGroup', 'i-rate': 'Rate', 'i-row': 'Row', 'i-select': 'Select', 'i-slider': 'Slider', 'i-spin': 'Spin', 'i-step': 'Step', 'i-steps': 'Steps', 'i-switch': 'i-switch', 'i-table': 'Table', 'i-tabs': 'Tabs', 'i-tab-pane': 'TabPane', 'i-tag': 'Tag', 'i-timeline': 'Timeline', 'i-timeline-item': 'TimelineItem', 'i-time-picker': 'TimePicker', 'i-tooltip': 'Tooltip', 'i-transfer': 'Transfer', 'i-tree': 'Tree', 'i-upload': 'Upload' }