iview 非 template/render 标签转换整理

今天我们来整理整理基于vue的iview框架学习,这个框架官方的教程是基于template模式进行开发的,也就是说基于nodejs方式开发.而我们想要脱离nodejs怎么办呢?难道就没有办法了么?其实不然,iview是可以脱离template模式实现的,那么我们就来说说非template下如何实现.其实非template实现方式和template模式下实现方式是一样的,只不过区别就是标签形式不同,下面我们就整理一下template模式和非template模式下标签的对应.主要有以下3类对应方式,如下:

非 template/render 模式下组件名称要分隔

DatePicker：date-picker
FormItem：form-item
CheckboxGroup：checkbox-group
InputNumber：input-number
BreadcrumbItem:breadcrumb-item
<menu-group>
<menu-item>
<radio-group>
<tab-pane>
<dropdown-menu>
<dropdown-item>

 

非 template/render 模式下，需要加前缀 i-

Button: i-button
Col: i-col
Table: i-table
Input: i-input
Form: i-form
Menu: i-menu
Select: i-select
Option: i-option
Progress: i-progress
Header:i-header
Content:i-content
Footer:i-footer
Switch: i-switch
Circle: i-circle

非 template/render 模式下，以下组件写法不变

<Card>
<Checkbox>
<Row>
<Card>
<Sider>
<Layout>
<Submenu>
<Panel>
<Collapse>
<Divider>
<CellGroup>
<Cell>
<Badge>
<Tabs>
<Radio>
<Dropdown>
<Breadcrumb>

 

以上就是template和非template模式下标签对应的区别,有了这个标签对应表,问题是不是就很好解决了呢,我想应该是的,希望通过官网能对非template模式进行详细的一个介绍.