9.2 KiB
常见问题
给组件绑定的事件为什么无法触发?
在 Vue 2.0 中,为自定义组件绑定原生事件必须使用 .native
修饰符:
<my-component @click.native="handleClick">Click Me</my-component>
从易用性的角度出发,我们对 Button
组件进行了处理,使它可以监听 click
事件:
<el-button @click="handleButtonClick">Click Me</el-button>
但是对于其他组件,还是需要添加 .native
修饰符。
如何在 Table 组件的每一行添加操作该行数据的按钮?
使用 Scoped slot 即可:
<el-table-column label="操作">
<template slot-scope="props">
<el-button @click.native="showDetail(props.row)">查看详情</el-button>
</template>
</el-table-column>
参数 row
即为对应行的数据。
Tree 组件的 `render-content` 和 Table 组件的 `render-header` 怎么用?
请阅读 Vue 文档 Render Function 的相关内容。注意,使用 JSX 来写 Render Function 的话,需要安装 babel-plugin-transform-vue-jsx
,并参照其文档进行配置。
所有组件的任意属性都支持 `.sync` 修饰符吗?
不是。对于支持 .sync
修饰符的属性,我们会在文档的 API 表格中注明。更多 .sync
的用法请查看 Vue 文档。
你们的文档怎么偷偷更新了?
我们只会在 Element 发布新版本时同步更新文档,以体现最新的变化。详细的更新内容可以查看 changelog。
在项目中引入 Element,但是 CSS 报错/字体文件报错/组件没有样式是什么原因?
请参考我们提供的 starter kit,在 webpack 的 loaders 中正确配置 file-loader、css-loader 和 style-loader。此外,我们还提供了基于 cooking 和 laravel 的项目模板。
将 Element 克隆至本地,运行时为何会报错/跑不起来?
首先,确保克隆的是 master 分支的最新代码,并且文件完整。其次,确保本地的 node 版本在 4.0 以上,npm 版本在 3.0 以上。最后,可以启动开发环境:
npm run dev
或是直接打包:
npm run dist
FAQ
Why are my event listeners not working?
In Vue 2.0, adding native event handlers in custom components requires a .native
modifier:
<my-component @click.native="handleClick">Click Me</my-component>
For the sake of usability, we processed Button
so it can listen to click
events:
<el-button @click="handleButtonClick">Click Me</el-button>
For other components, the .native
modifier is still mandatory.
How do I add buttons in each row of Table to operate data of that row?
Just use Scoped slot:
<el-table-column label="Operations">
<template slot-scope="props">
<el-button @click.native="showDetail(props.row)">Details</el-button>
</template>
</el-table-column>
The parameter row
is the data object of corresponding row.
How do `render-content` of Tree and `render-header` of Table work?
Please refer to Render Function in Vue's documentation. In addition, if you are writing render functions with JSX, babel-plugin-transform-vue-jsx
is required. See here for its configurations.
Can I use `.sync` modifier on every attribute?
No, only a few attributes supports the .sync
modifier, and we have explicitly marked them on the documentation's API table. For more information about .sync
, please refer to Vue documentation.
When do you update documentations of Element?
We update documentations only when a new version of Element is published so that it reflects all the changes introduced in that version. Updated changed can be found in the changelog。
I imported Element in my project, but why does it report CSS error/font file error/components have no style?
Please refer to our starter kit and correctly configure file-loader, css-loader and style-loader in webpack config file. Besides, we also provide templated based on cooking and laravel.
I cloned Element's repo, but failed to run it. How do I solve it?
First, please make sure to clone the latest code in master branch and cloned files are intact. Then, note that the version of Nodejs should be 4.0+ and npm 3.0+. Finally, activate development:
npm run dev
or build it:
npm run dist
Preguntas más frecuentes
¿Porque mis receptores de eventos no funcionan?
En Vue 2.0, agregando nativos receptores de evento a medida componentes requiere el modificador .native
:
html
<mi-componente @click.native="handleClick">Haga Clic Aquí</mi-componente>
Para conveniencia, hemos ya procesado eventos para el componente Button
para que el interfaz sea consistente con clic
eventos de otros componentes:
<el-button @click="handleButtonClick">Haga Clic Aquí</el-button>
Para otros componentes el uso del modificador .native
sigue siendo obligatorio.
¿Como agrego botones en cada linea de una tabla para que operen en los datos de esa linea?
Simplemente agregue “Scoped slot”:
<el-table-column label="Operaciones">
<template slot-scope="props">
<el-button @click.native="verDetalles(props.row)">Detalles</el-button>
</template>
</el-table-column>
El parámetro row
contiene los datos de la linea correspondiente de la tabla.
¿Como funcionan `render-content` de `Tree` y `render-header` de `Table`?
Por favor refiérase a Función de representación en la documentación de Vue
. Adicionalmente, sí usted está escribiendo funciones de representar con JSX, se requiere el componente babel-plugin-transform-vue-jsx
. Más información aquí para su uso y configuración.
¿Puedo usar el modificador `.sync` con cada atributo?
No, solamente un grupo pequeño de atributos apoyan el modificador .sync
, y están anotados claramente en la documentación del IPA. Para información adicional sobre .sync
, por favor refiérase a documentación de Vue.
¿Cuando añaden a la documentación de `Element`?
Añadamos la documentación con cada versión nueva de Element
y los cambios reflejan los cambios del software de esa versión. Los cambios actuales y históricos se encuentran aquí.
¿Importé `Element` a mi proyecto pero tengo errores con `CSS` y/o fuentes y mis componentes no tienen ningún estilo?
Refiérase a nuestro ‘kit’ de inicio y configure correctamente file-loader
, css-loader
y style-loader
en el archivo webpack config
. Además, proveemos un ejemplar para cooking y para laravel.
Hice un clon del repositorio de `Element` pero no arranca. ¿Como lo resuelvo?
Primero, pro favor, asegúrese de usar la versión más corriente en la rama master
y que los archivos están en orden. Después, revise sí la versión de Nodejs
es 4.0+ y npm
debe ser 3.0+. Finalmente active el modo desarrollo:
npm run dev
O arme su aplicación así:
npm run dist