项目须要用到的iview 表格中操做项目有各类各样的图标,而各类各样的图标表明不一样的操做,面对新用户可能很懵,那如何给这些图标添加Tooltip文字提示?html
废话很少讲,直接看代码:iview
<template> <Table :columns="columns" :data="data"></Table> </template> <script> export default { data () { return { columns: [ { title: 'Name', key: 'name' }, { title: 'Age', key: 'age' }, { title: 'Address', key: 'address' }, { title: '操做', key: 'action', render: (h, { row }) => { return h('div', [ h('Tooltip', { props: { placement: 'top', transfer: 'true', content: '提示文字内容' } }, [ h('Icon', { props: { // custom: 'icon-seewrap' //自定义图标 type: 'md-add', size: '28' }, on: { click: () => { // 添加 alert("添加") } } }) ]) ]) } } ], data: [ { name: 'John Brown', age: 18, address: 'New York No. 1 Lake Park', date: '2016-10-03' }, { name: 'Jim Green', age: 24, address: 'London No. 1 Lake Park', date: '2016-10-01' } ] } } } </script>