mint-ui —— cell的使用

版权声明:本文为博主原创文章,转载务必注明出处,http://blog.csdn.net/michael_ouyang。 https://blog.csdn.net/michael_ouyang/article/details/77550632


Cell

单元格,可用作展示列表信息、链接或者表单等。

Import

按需引入:

import { Cell } from 'mint-ui';

Vue.component(Cell.name, Cell);

全局导入:全局导入后不用再导入

importMint from'mint-ui'

import'mint-ui/lib/style.css'

Vue.use(Mint);

API




示例

xxx.vue

<template>
  <div id="app">	
	<!-- 列表使用 -->
	<mt-cell
	  title="标题文字"
	  :to="link"
	   is-link
	  value="带链接">
	</mt-cell>
	<!-- 列表使用 -->
	<mt-cell title="标题" label="描述信息" is-link></mt-cell>
	<!-- 列表使用 -->
	<mt-cell title="标题" is-link>
	  <span>信息</span>
	  <img slot="icon" src="../assets/logo.png" width="24" height="24">
	</mt-cell>
 </div>
</template>

<script>
export default {
  data () {
  	return {
  		link:'//blog.csdn.net/michael_ouyang'
  	}
  },
  mounted:function(){
  	
  }
}
</script>

<style>

</style>

show

3种列表项的格式




demo链接:http://download.csdn.net/download/michael_ouyang/9949550
使用前输入命令:
npm install
npm run dev


猜你喜欢

转载自blog.csdn.net/michael_ouyang/article/details/77550632