項目須要用到的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>