Lin UI vscode代码片段

{
	// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
	// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
	// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is 
	// used to trigger the snippet and the body will be expanded and inserted. Possible variables are: 
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. 
	// Placeholders with the same ids are connected.
	// Example:
	// "Print to console": {
	// 	"scope": "javascript,typescript",
	// 	"prefix": "log",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
	"Lin UI折叠面板子项组件Snippet": {
		"prefix": "wl-collapse-item",
		"body": [
			"<l-collapse-item",
			" item-id=\"折叠面板子项id,需要确保唯一性\"",
			" disable=\"{{false}}\"",
			" title=\"标题文字\"",
			" custom-title=\"{{false}}\"",
			" animation-time=\"0.3\"",
			">",
			"<!-- 折叠面板子项内容 -->",
			"</l-collapse-item>",
		],
		"description": "Lin UI折叠面板子项代码片段"
	},
	"Lin UI列表组件Snippet": {
		"prefix": "wl-list",
		"body": [
			"<l-list",
			" icon=\"add\"",
			" icon-color=\"#34BFA3\"",
			" icon-size=\"28\"",
			" title=\"列表组件中左侧文本的内容\"",
			" desc=\"列表组件中左侧描述文本的内容\"",
			" right-desc=\"列表组件中右侧描述文本的内容\"",
			" is-link=\"{{true}}\"",
			" link-type=\"navigateTo|redirectTo|reLaunch|switchTab\"",
			" url=\"跳转的路径\"",
			" tag-content=\"标签的内容\"",
			" tag-position=\"right|left\"",
			" tag-color=\"#34BFA3\"",
			" tag-shape=\"square|circle\"",
			" tag-plain=\"{{true}}\"",
			" dotBadge=\"{{false}}\"",
			" badge-count=\"12\"",
			" badge-position=\"right|left\"",
			" badge-max-count=\"9\"",
			" badge-count-type=\"overflow|limit|custom\"",
			" left-gap=\"0\"",
			" right-gap=\"0\"",
			" is-hover=\"{{true}}\"",
			"/>",
		],
		"description": "Lin UI列表组件代码片段"
	},
	"Lin UI按钮组件Snippet": {
		"prefix": "wl-button",
		"body": [
			"<l-button",
			" type=\"default|success|error|warning\"",
			" size=\"mini(小)|medium(中)|large(大)|long(通栏按钮)\"",
			" width=\"500rpx\"",
			" height=\"120rpx\"",
			" shape=\"square(直角)|circle(圆弧)或semicircle(半圆)\"",
			" plain=\"{{true}}\"",
			" disabled=\"{{false}}\"",
			" loading=\"{{false}}\"",
			" icon=\"warning\"",
			" icon-size=\"20\"",
			" icon-color=\"#000\"",
			" bind:lintap=\"handleEvent\"",
			" bind:contact=\"handleEvent\"",
			" bind:getphonenumber=\"handleEvent\"",
			" bind:error=\"handleEvent\"",
			" bind:opensetting=\"handleEvent\"",
			" bind:getuserinfo=\"handleEvent\"",
			" bind:chooseavatar=\"handleEvent\"",
			">",
			"我的按钮",
			"</l-button>",
			"<!-- bind:lintap 按钮在非禁用状态下点击所触发的事件",
			"bind:contact 客服消息回调",
			"bind:getphonenumber 获取用户手机号回调",
			"bind:error 当使用开放能力时,发生错误的回调",
			"bind:opensetting 在打开授权设置页后回调",
			"bind:getuserinfo 用户点击该按钮时,会返回获取到的用户信息,回调的detail数据与wx.getUserInfo (opens new window)返回的一 致",
			"bind:chooseavatar 获取用户头像,可以从 bindchooseavatar 回调中获取到头像信息 -->",
		],
		"description": "Lin UI按钮组件代码片段"
	},
	"Lin UI图标组件Snippet": {
		"prefix": "wl-icon",
		"body": [
			"<l-icon name=\"add\" color=\"#34BFA3\" size=\"30\" />",
		],
		"description": "Lin UI图标组件代码片段"
	},
	"Lin UI过渡动画组件Snippet": {
		"prefix": "wl-transition",
		"body": [
			"<l-transition",
			" show=\"{{ show }}\"",
			" name=\"fade\"",
			" bind:linbeforeenter=\"beforeEnter\"",
			" bind:linenter=\"entering\"",
			" bind:linafterenter=\"afterEnter\"",
			" bind:linbeforeleave=\"beforeLeave\"",
			" bind:linleave=\"leaving\"",
			" bind:linafterleave=\"afterLeave\"",
			">",
			"过渡动画",
			"</l-transition>",
			"<!-- duration=\"{{ { enter: 300, leave: 1000 } }}\" ",
			"name=\"fade(淡入)|fade-up(上滑淡入)|fade-down(下滑淡入)|fade-left(左滑淡入)|fade-right(右滑淡入)|slide-up(上滑进入)|slide-down(下滑进入)|slide-left(左滑进入)|slide-right(右滑进入)\" -->",
		],
		"description": "Lin UI过渡动画组件代码片段"
	},
	"Lin UI宫格组件Snippet": {
		"prefix": "wl-grid",
		"body": [
			"<l-grid",
			" row-num=\"3\"",
			" show-border=\"{{false}}\"",
			" show-row-border=\"{{true}}\"",
			" show-col-border=\"{{false}}\"",
			" is-hover=\"{{true}}\"",
			">",
			"<l-grid-item key=\"key的值\" slot=\"slot的值必须和key的值相等\">",
			"<!-- 宫格内容 -->",
			"</l-grid-item>",
			"</l-grid>",
		],
		"description": "Lin UI宫格组件代码片段"
	},
	"Lin UI宫格项组件Snippet": {
		"prefix": "wl-grid-item",
		"body": [
			"<l-grid-item key=\"key的值\" slot=\"slot的值必须和key的值相等\">",
			"<!-- 宫格内容 -->",
			"</l-grid-item>",
		],
		"description": "Lin UI宫格项组件代码片段"
	},
	"Lin UI卡片组件Snippet": {
		"prefix": "wl-card",
		"body": [
			"<l-card",
			" type=\"primary|avatar|cover\"",
			" image=\"卡片内图片的路径\"",
			" title=\"卡片的标题\"",
			" describe=\"卡片的描述\"",
			" position=\"left|right\"",
			" plaintext=\"{{false}}\"",
			" full=\"{{false}}\"",
			">",
			"<view>卡片内容</view>",
			"</l-card>",
			"<!-- type 卡片类型 String",
			"image 卡片内图片的路径 String",
			"image-mode 卡片内图片的显示模式",
			"title 卡片的标题 String",
			"describe 卡片的描述 String",
			"position 卡片内图片的位置 String",
			"plaintext 卡片是否为纯文字卡片 Boolean",
			"full 卡片是否为通栏卡片 Boolean -->",
		],
		"description": "Lin UI卡片组件代码片段"
	},
	"Lin UI相册组件Snippet": {
		"prefix": "wl-album",
		"body": [
			"<l-album",
			" urls='{{urls}}'",
			" key='url'",
			" preview=\"{{true}}\"",
			" gap-row=\"10\"",
			" gap-colum=\"10\"",
			" max-number=\"9\"",
			" custom-row-number=\"{{false}}\"",
			" every-row-number=\"3\"",
			" bind:lintap=\"handleEvent\"",
			"/>",
			"<!-- bind:lintap点击图片时触发 event.detail = {current:[ 当前点击项的信息 ], all: [ 当前所有项信息 ], index: 点击项的下标} -->",
		],
		"description": "Lin UI相册组件代码片段"
	},
	"Lin UI折叠面板组件Snippet": {
		"prefix": "wl-collapse",
		"body": [
			"<l-collapse",
			" type=\"normal|accordion\"",
			" expand-item-id=\"\"",
			" bind:linfold=\"handleEvent\"",
			" bind:linexpand=\"handleEvent\"",
			">",
			"<!-- expand-item-id初始状态需要展开的折叠面板子项id(手风琴模式下取数组第一个值)Array",
			"bind:linfold折叠面板折叠回调事件折叠面板子项id",
			"bind:linexpand折叠面板展开回调事件折叠面板子项id -->",
			"<l-collapse-item title=\"子面板1\">",
			"<!-- 面板内容 -->",
			"</l-collapse-item>",
			"<l-collapse-item title=\"子面板2\">",
			"<!-- 面板内容 -->",
			"</l-collapse-item>",
			"</l-collapse>",
		],
		"description": "Lin UI折叠面板组件代码片段"
	},
	"Lin UI图像头像组件Snippet": {
		"prefix": "wl-avatar-image",
		"body": [
			"<l-avatar",
			" text=\"MyAvatar\"",
			" placement=\"left|right|top|bottom\"",
			" shape=\"circle\"",
			" size=100",
			" src=\"绝对图像路径\"",
			" bind:lintap=\"handleEvent\"",
			"/>",
		],
		"description": "Lin UI图像头像组件代码片段"
	},
	"Lin UI图标头像组件Snippet": {
		"prefix": "wl-avatar-icon",
		"body": [
			"<l-avatar",
			" text=\"MyAvatar\"",
			" placement=\"left|right|top|bottom\"",
			" shape=\"circle\"",
			" size=\"100\"",
			" icon=\"user\"",
			" icon-color=\"#34BFA3\"",
			" icon-size=\"28\"",
			" bind:lintap=\"handleEvent\"",
			"/>",
		],
		"description": "Lin UI图标头像组件代码片段"
	},
	"Lin UI徽章组件Snippet": {
		"prefix": "wl-badge",
		"body": [
			"<l-badge",
			" dot=\"{{false}}\"",
			" value=\"10\"",
			" max-count=\"99\"",
			" show=\"{{true}}\"",
			" mode=\"number|text\"",
			" number-type=\"overflow|ellipsis|limit\"",
			" shape=\"circle|horn\"",
			" bind:lintap=\"handleEvent\"",
			">",
			"<view class=\"\" hover-class=\"none\" hover-stop-propagation=\"false\" />",
			"</l-badge>",
			"<!-- 通过number-type属性设置徽标内数字的显示方式。可选值为overflow、ellipsis、limit,默认值为overflow。",
			"设置number-type为overflow,超过max-count会显示为${max-count}+。通过max-count属性修改数字最大值,max-count默认值为99。",
			"设置number-type为ellipsis,超过max-count会显示为...。通过max-count属性修改数字最大值,max-count默认值为99。",
			"设置number-type为limit时数字大于1000显示为${value/1000}k。 -->",
		],
		"description": "Lin UI徽章组件代码片段"
	},
	"Lin UI DateTime类型的倒计时组件Snippet": {
		"prefix": "wl-countdown-datetime",
		"body": [
			"<l-countdown",
			" status=\"{{true}}\"",
			" l-class-time=\"countdown-blue\"",
			" l-class=\"countdown-text\"",
			" time-type=\"datetime\"",
			" countdownType=\"anniversary|normal\"",
			" time=\"2022-11-09 00:00\"",
			" is-zero-padd=\"{{true}}\"",
			" format=\"{%d}天{%h}时{%m}分{%s}秒\"",
			" bind:linend=\"handleEvent\"",
			"/>",
			"<!-- .content .countdown-blue {",
			"width: 52rpx ;",
			"height: 52rpx;",
			"border: 2rpx solid #3683D6;",
			"border-radius: 50%;",
			"background:transparent;",
			"color: #3683D6;",
			"}",
			".content .countdown-text {",
			"color: #3683D6;",
			"} -->",
		],
		"description": "Lin UI DateTime类型的倒计时组件代码片段"
	},
	"Lin UI Second类型的倒计时组件Snippet": {
		"prefix": "wl-countdown-second",
		"body": [
			"<l-countdown",
			" status=\"{{true}}\"",
			" l-class-time=\"countdown-blue\"",
			" l-class=\"countdown-text\"",
			" time-type=\"second\"",
			" countdownType=\"anniversary|normal\"",
			" time=\"1500\"",
			" is-zero-padd=\"{{true}}\"",
			" format=\"{%d}天{%h}时{%m}分{%s}秒\"",
			" bind:linend=\"handleEvent\"",
			"/>",
			"<!-- .content .countdown-blue {",
			"width: 52rpx ;",
			"height: 52rpx;",
			"border: 2rpx solid #3683D6;",
			"border-radius: 50%;",
			"background:transparent;",
			"color: #3683D6;",
			"}",
			".content .countdown-text {",
			"color: #3683D6;",
			"} -->",
		],
		"description": "Lin UI Second类型的倒计时组件代码片段"
	},
	"Lin UI加载中组件Snippet": {
		"prefix": "wl-loading",
		"body": [
			"<l-loading",
			" show=\"{{true}}\"",
			" type=\"flash|flip|change|circle|rotate\"",
			" size=\"mini|medium|large\"",
			" color=\"#666\"",
			" z-index=\"776\"",
			" custom=\"{{false}}\"",
			" full-screen=\"{{false}}\"",
			" bg-color=\"#666\"",
			" opacity=\"1\"",
			"/>",
		],
		"description": "Lin UI加载中组件代码片段"
	},
	"Lin UI页底提示组件Snippet": {
		"prefix": "wl-loadmore",
		"body": [
			"<l-loadmore",
			" show=\"{{true}}\"",
			" type=\"end|loading\"",
			" loading-text=\"加载中状态的文案,设置loading-text属性可覆盖loading状态下的默认文本\"",
			" end-text=\"加载完成状态的文案,设置end-text属性覆盖end状态下的默认文本\"",
			" line=\"{{true}}\"",
			" size=\"28\"",
			" color=\"#666\"",
			" custom=\"{{false}}\"",
			" bind:lintap=\"handleEvent\"",
			">",
			"<view slot=\"content\">自定义展示内容</view>",
			"<!-- <view slot=\"custom\">自定义页底加载类型</view> -->",
			"<view slot=\"loading\">自定义加载时提示的内容</view>",
			"<view slot=\"end\">自定义加载完成提示的内容</view>",
			"</l-loadmore>",
		],
		"description": "Lin UI页底提示组件代码片段"
	},
	"Lin UI遮罩层组件Snippet": {
		"prefix": "wl-mask",
		"body": [
			"<l-mask",
			" show=\"{{true}}\"",
			" opacity=\"0.5\"",
			" z-index=\"99\"",
			" center=\"{{true}}\"",
			" locked=\"{{false}}\"",
			" bind:lintap=\"handleEvent\"",
			"/>",
		],
		"description": "Lin UI遮罩层组件代码片段"
	},
	"Lin UI通告栏组件Snippet": {
		"prefix": "wl-notice-bar",
		"body": [
			"<l-notice-bar",
			" id=\"my-notice-bar\"",
			" show=\"{{true}}\"",
			" front-icon-name=\"notification\"",
			" front-icon-size=\"20\"",
			" front-icon-color=\"#3683D6\"",
			" end-icon-name=\"close\"",
			" end-icon-size=\"20\"",
			" end-icon-color=\"#3683D6\"",
			" colse=\"{{false}}\"",
			" type=\"still|roll|swip\"",
			" swip-arr=\"{{arr}}\"",
			" speed=\"1500\"",
			" bind:lintap=\"handleEvent\"",
			" bind:linicontap=\"handleEvent\"",
			">",
			"我是通告栏",
			"</l-notice-bar>",
			"<!-- 通过type属性设置通告栏类型为still(静止),roll(字幕滚动),swip(轮播)。默认值为still。",
			"当通告栏的类型为swip时,轮播的内容需通过swip-arr属性传入。",
			"滚动速度仅在type设置为swip和roll时生效。speed数值越小速度越快,数值越大速度越慢。",
			"getNoticeBar(){",
			"// 模拟 API 获取内容",
			"let apiContent = wx.request(\"...\");",
			"this.setData({",
			"content: apiContent",
			"},()=>{",
			"// 获取 notice-bar 组件实例",
			"const noticeBarComponent = this.selectComponent(\"#my-notice-bar\");",
			"// 刷新组件动画",
			"noticeBarComponent.linFlush();",
			"});",
			"}",
			"//如果你的通告栏内容不是写死在 wxml 文件中,而是在运行过程中会动态修改的(比如通过 API 请求修改通告栏内容),",
			"//那么你需要在修改通告栏内容之后调用 linFlush() 开放函数刷新一下,通告栏滚动动画才会正常显示。 -->",
		],
		"description": "Lin UI通告栏组件代码片段"
	},
	"Lin UI弹出层组件Snippet": {
		"prefix": "wl-popup",
		"body": [
			"<l-popup",
			" show=\"{{true}}\"",
			" animation=\"{{true}}\"",
			" content-align=\"top|left|right|bottom|center\"",
			" locked=\"{{false}}\"",
			" bind:lintap=\"handleEvent\"",
			">",
			"<view class=\"popup-buttom\">从下方弹出</view>",
			"</l-popup>",
		],
		"description": "Lin UI弹出层组件代码片段"
	},
	"Lin UI进度条组件Snippet": {
		"prefix": "wl-progress",
		"body": [
			"<l-progress",
			" percent=\"35\"",
			" stroke-width='20'",
			" border-radius='8'",
			" active-color=\"#666\"",
			" background-color='#EEE'",
			" show-info=\"{{true}}\"",
			" text-position=\"right|left\"",
			" text-color='#666'",
			" interval=\"20rpx\"",
			" active=\"{{true}}\"",
			">",
			"<view slot='header' style=\"width: 30rpx;height:30rpx;border-radius:50%;background-color:#555;display:block;\" />",
			"</l-progress>",
		],
		"description": "Lin UI进度条组件代码片段"
	},
	"Lin UI状态显示页组件Snippet": {
		"prefix": "wl-status-show",
		"body": [
			"<l-status-show",
			" show=\"{{true}}\"",
			" bg-color=\"f3f3f3\"",
			" full-screen=\"{{false}}\"",
			" type=\"success|error|network|cart|order|address|data|product\"",
			" image=\"../../image.png\"",
			" describe=\"我是描述文案\"",
			" button-text=\"按钮文案\"",
			" custom=\"{{false}}\"",
			" bind:lintap=\"handleEvent\"",
			" bind:lincovertap=\"handleEvent\"",
			">",
			"<view>通过设置custom属性可设置自定义状态展示页。通过slot传入自定义的状态展示内容。</view>",
			"</l-status-show>",
			"<!-- bind:lintap 点击按钮触发的事件",
			"bind:lincovertap 点击状态页组件触发的事件 -->",
		],
		"description": "Lin UI状态显示页代码片段"
	},
	"Lin UI标签组件Snippet": {
		"prefix": "wl-tag",
		"body": [
			"<l-tag",
			" shape=\"circle|square\"",
			" size=\"super-mini(超小)|mini(小)|medium(中)|large(大)\"",
			" type=\"touch|reading\"",
			" palin=\"{{true}}\"",
			" name=\"my-tag\"",
			" cell=\"my-tag\"",
			" height=\"60rpx\"",
			" bg-color=\"#666\"",
			" font-color=\"#EEE\"",
			" icon-size=\"20\"",
			" icon=\"warning\"",
			" location=\"right|left\"",
			" image=\"../image.png\"",
			" disable=\"{{false}}\"",
			" select=\"{{true}}\"",
			" bind:lintap=\"handleEvent\"",
			">",
			"我是标签组件",
			"</l-tag>",
			"<!-- bind:lintap 点击标签时触发的事件,返回当前标签的标示和选中状态 {name,cell,select} -->",
		],
		"description": "Lin UI标签组件代码片段"
	},
	"Lin UI步骤条组件Snippet": {
		"prefix": "wl-steps",
		"body": [
			"<l-steps",
			" active-index=\"1\"",
			" direction=\"row\"",
			" step-min-height=\"120rpx\"",
			" reverse=\"{{false}}\"",
			" status=\"process\"",
			" dot=\"{{true}}\"",
			" color=\"#48a7e3\"",
			">",
			"<l-step title=\"title\" custom=\"{{true}}\">",
			"<l-icon",
			" name=\"user\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			" slot=\"dot\"",
			"/>",
			"<view slot=\"describe\">自定义步骤条元素描述内容</view>",
			"</l-step>",
			"<l-step",
			" title=\"title\"",
			" describe=\"describe\"",
			" icon=\"user\"",
			" icon-size=\"28\"",
			" icon-color=\"#EEE\"",
			" custom=\"{{false}}\"",
			"/>",
			"</l-steps>",
		],
		"description": "Lin UI步骤条组件代码片段"
	},
	"Lin UI步骤条元素组件Snippet": {
		"prefix": "wl-step",
		"body": [
			"<l-step title=\"title\" custom=\"{{true}}\">",
			"<l-icon",
			" name=\"user\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			" slot=\"dot\"",
			"/>",
			"<view slot=\"describe\">自定义步骤条元素描述内容</view>",
			"</l-step>",
			"<l-step",
			" title=\"title\"",
			" describe=\"describe\"",
			" icon=\"user\"",
			" icon-size=\"28\"",
			" icon-color=\"#EEE\"",
			" custom=\"{{false}}\"",
			"/>",
		],
		"description": "Lin UI步骤条元素组件代码片段"
	},
	"Lin UI圆形进度条组件Snippet": {
		"prefix": "wl-circle",
		"body": [
			"<l-circle",
			" percent='35'",
			" outer-diameter='220rpx'",
			" inner-diameter='170rpx'",
			" active-color='#333'",
			" background-color='#EEE'",
			" inner-color='yellow'",
			" show-value='{{true}}'",
			" show-info='{{true}}'",
			" value-color='red'",
			" value-size='30'",
			" active=\"{{false}}\"",
			">",
			"<!-- <image src=\"timg.jpeg\" style=\"width:90rpx;height:90rpx;border-radius:50%;display:block;\" /> -->",
			"</l-circle>",
		],
		"description": "Lin UI圆形进度条组件代码片段"
	},
	"Lin UI选项卡组件Snippet": {
		"prefix": "wl-segment",
		"body": [
			"<l-segment",
			" active-color=\"#EEE\"",
			" inactive-color=\"#333\"",
			" has-line=\"{{true}}\"",
			" even=\"{{true}}\"",
			" placement=\"top|left|right|bottom\"",
			" active-key=\"tabKey\"",
			" scrollable=\"{{true}}\"",
			" bind:linchange=\"handleEvent\"",
			">",
			"<l-segment-item",
			" icon=\"user\"",
			" icon-size=\"28rpx\"",
			" picPlacement=\"top|left|right|bottom\"",
			" badge-count-type=\"overflow|limit|custom\"",
			" dot-badge=\"{{false}}\"",
			" badge-count=\"35\"",
			" badge-max-count=\"99\"",
			" tab=\"选项卡名称\"",
			" key=\"tabKey\"",
			"/>",
			"</l-segment>",
			"<!-- bind:linchange",
			"segment切换的回调事件",
			"activeKey:当前激活选项卡的 key",
			"currentIndex:当前激活选项卡的索引",
			"cell:segment-item 绑定的自定义数据 -->",
		],
		"description": "Lin UI选项卡组件代码片段"
	},
	"Lin UI选项卡子项组件Snippet": {
		"prefix": "wl-segment-item",
		"body": [
			"<l-segment-item",
			" icon=\"user\"",
			" icon-size=\"28rpx\"",
			" picPlacement=\"top|left|right|bottom\"",
			" badge-count-type=\"overflow|limit|custom\"",
			" dot-badge=\"{{false}}\"",
			" badge-count=\"35\"",
			" badge-max-count=\"99\"",
			" tab=\"选项卡名称\"",
			" key=\"tabKey\"",
			"/>",
		],
		"description": "Lin UI选项卡子项组件代码片段"
	},
	"Lin UI胶囊栏组件Snippet": {
		"prefix": "wl-capsule-bar",
		"body": [
			"<l-capsule-bar",
			" home-page=\"/pages/home/home\"",
			" title=\"wpp的微信小程序\"",
			" title-color=\"标题颜色\"",
			" bg-color=\"CapsuleBar背景色\"",
			" status-bar-color=\"StatusBar背景色\"",
			" title-bar-color=\"TitleBar背景色\"",
			" capsule-left-icon-width=\"38\"",
			" capsule-left-icon-height=\"38\"",
			" capsule-color=\"左侧胶囊按钮颜色(使用自定义图标时无效 white/black\"",
			" capsule-right-icon-width=\"38\"",
			" capsule-right-icon-height=\"38\"",
			" capsule-left-icon-path=\"https://cdn.talelin.com/20201226182234.png\"",
			" capsule-right-icon-path=\"https://cdn.talelin.com/20201226182244.png\"",
			" disable-back=\"{{false}}\"",
			" disable-home=\"{{false}}\"",
			" hidden-capsule=\"{{false}}\"",
			" hidden-title=\"{{false}}\"",
			" bind:linlefttap=\"handleEvent\"",
			" bind:linleftlongpress=\"handleEvent\"",
			" bind:linrighttap=\"handleEvent\"",
			" bind:linrightlongpress=\"handleEvent\"",
			">",
			"<view>内容</view>",
			"<!-- bind:linlefttap 点击胶囊左侧按钮回调事件(在返回上一页之前触发)",
			"bind:linleftlongpress 长按胶囊左侧按钮回调事件",
			"bind:linrighttap 点击胶囊右侧按钮回调事件(在返回主页之前触发)",
			"bind:linrightlongpress 长按胶囊右侧按钮回调事件 -->",
			"</l-capsule-bar>",
		],
		"description": "Lin UI胶囊栏组件代码片段"
	},
	"Lin UI轻提示组件Snippet": {
		"prefix": "wl-toast",
		"body": [
			"<l-toast",
			" show=\"{{true}}\"",
			" image=\"path/to/img.png\"",
			" icon=\"success\"",
			" icon-size=\"60rpx\"",
			" icon-color=\"#fff\"",
			" title=\"这是一条基础提示框\"",
			" placement=\"top|left|right|bottom\"",
			" duration=\"1500\"",
			" offsetX=\"0\"",
			" offsetY=\"0\"",
			"/>",
		],
		"description": "Lin UI轻提示组件代码片段"
	},
	"Lin UI模态框组件Snippet": {
		"prefix": "wl-dialog",
		"body": [
			"<l-dialog",
			" show=\"{{true}}\"",
			" type=\"alert|confirm\"",
			" show-title=\"{{true}}\"",
			" title=\"标题\"",
			" content=\"内容\"",
			" confirm-text=\"yes\"",
			" confirm-color=\"#f60\"",
			" cancel-text=\"no~\"",
			" cancel-color=\"#999\"",
			" locked=\"{{true}}\"",
			" bind:lintap=\"handleEvent\"",
			" bind:linconfirm=\"handleEvent\"",
			" bind:lincancel=\"handleEvent\"",
			">",
			"<image class='dio-img' src='/path/to/example.gif' />",
			"</l-dialog>",
			"<!-- bind:lintap 当点击背景时触发的事件",
			"bind:linconfirm 当点击确定时触发的事件 confirm",
			"bind:lincancel 当点击取消时触发的事件 cancel -->",
		],
		"description": "Lin UI模态框组件代码片段"
	},
	"Lin UI输入框组件Snippet": {
		"prefix": "wl-input",
		"body": [
			"<l-input",
			" type=\"text|idcard|password|number|digit\"",
			" label=\"标签名称\"",
			" width=\"750\"",
			" maxlength=\"140\"",
			" tip-type=\"toast|message|text\"",
			" showRow=\"{{true}}\"",
			" colon=\"{{false}}\"",
			" focus=\"{{true}}\"",
			" value=\"{{inputValue}}\"",
			" hide-label=\"{{false}}\"",
			" label-layout=\"left|right\"",
			" label-width=\"200\"",
			" placeholder=\"占位符\"",
			" clear=\"{{true}}\"",
			" required=\"{{true}}\"",
			" rules=\"{{cardRule}}\"",
			" disable=\"{{false}}\"",
			" bind:lininput=\"handleEvent\"",
			" bind:linfocus=\"handleEvent\"",
			" bind:linblur=\"handleEvent\"",
			" bind:linconfirm=\"handleEvent\"",
			" bind:linclear=\"handleEvent\"",
			">",
			"<!-- <view slot=\"left\">",
			"<image src=\"path/to/email.png\" />",
			"<text>自定义Input组件左边(label)部分</text>",
			"</view> -->",
			"<image slot=\"right\" src=\"path/to/img.png\" />",
			"</l-input>",
			"<!-- data:{",
			"inputValue:\"\",",
			"cardRule:[{",
			"required: true",
			"},{",
			"type: 'number',",
			"min: 16,",
			"max: 19,",
			"message: \"长度在16-19之间\"",
			"}]",
			"} -->",
			"<!-- bind:lininput 键盘输入时触发 输入框当前值 value -",
			"bind:linfocus 输入框聚焦时触发 输入框当前值 value -",
			"bind:linblur 输入框失去焦点时触发 输入框当前值 value -",
			"bind:linconfirm 点击完成按钮时触发 输入框当前值 value -",
			"bind:linclear 点击清除按钮时触发 -->",
		],
		"description": "Lin UI输入框组件代码片段"
	},
	"Lin UI文本域组件Snippet": {
		"prefix": "wl-textarea",
		"body": [
			"<l-textarea",
			" value=\"{{textareaValue}}\"",
			" border=\"{{true}}\"",
			" disable=\"{{false}}\"",
			" focus=\"{{false}}\"",
			" rules=\"{{rules}}\"",
			" tip-type=\"toast|message|text\"",
			" auto-height=\"{{true}}\"",
			" indicator=\"{{true}}\"",
			" maxlength=\"140\"",
			" placeholder=\"说说你的想法吧...\"",
			" bind:lininput=\"handleEvent\"",
			" bind:linfocus=\"handleEvent\"",
			" bind:linblur=\"handleEvent\"",
			" bind:linconfirm=\"handleEvent\"",
			"/>",
		],
		"description": "Lin UI文本域组件代码片段"
	},
	"Lin UI单项选择器组件Snippet": {
		"prefix": "wl-radio-group",
		"body": [
			"<l-radio-group",
			" current=\"2\"",
			" none-checked=\"{{false}}\"",
			" placement=\"row|column\"",
			" bind:linchange=\"handleEvent\"",
			">",
			"<l-radio",
			" placement=\"left|right\"",
			" disable=\"{{false}}\"",
			" color=\"red\"",
			" size=\"32\"",
			" select-color=\"green\"",
			" key=\"1\"",
			" custom=\"{{true}}\"",
			">",
			"<l-icon",
			" slot=\"custom\"",
			" name=\"add\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			"/>",
			"<text>选项1</text>",
			"</l-radio>",
			"<l-radio",
			" placement=\"left|right\"",
			" disable=\"{{false}}\"",
			" color=\"red\"",
			" size=\"32\"",
			" select-color=\"green\"",
			" key=\"2\"",
			">",
			"选项2",
			"</l-radio>",
			"</l-radio-group>",
		],
		"description": "Lin UI单项选择器组件代码片段"
	},
	"Lin UI单选框组件Snippet": {
		"prefix": "wl-radio",
		"body": [
			"<l-radio",
			" placement=\"left|right\"",
			" disable=\"{{false}}\"",
			" color=\"red\"",
			" size=\"32\"",
			" select-color=\"green\"",
			" key=\"1\"",
			" custom=\"{{true}}\"",
			">",
			"<l-icon",
			" slot=\"custom\"",
			" name=\"add\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			"/>",
			"<text>选项1</text>",
			"</l-radio>",
			"<l-radio",
			" placement=\"left|right\"",
			" disable=\"{{false}}\"",
			" color=\"red\"",
			" size=\"32\"",
			" select-color=\"green\"",
			" key=\"2\"",
			">",
			"选项2",
			"</l-radio>",
		],
		"description": "Lin UI单选框组件代码片段"
	},
	"Lin UI复选框容器组件Snippet": {
		"prefix": "wl-checkbox-group",
		"body": [
			"<l-checkbox-group",
			" min-selected=\"{{2}}\"",
			" max-selected=\"{{4}}\"",
			" palcement=\"row|column\"",
			" bind:linchange=\"onCheckboxChange\"",
			" bind:linout=\"handleEvent\"",
			">",
			"<l-checkbox",
			" placement=\"left|right\"",
			" wx:for-items=\"{{countries}}\"",
			" wx:key=\"{{item.value}}\"",
			" key=\"{{item.value}}\"",
			" checked=\"{{item.isChecked}}\"",
			" disabled=\"{{item.disabled}}\"",
			" size=\"38rpx\"",
			" color=\"red\"",
			" selected-color=\"green\"",
			" disabled-color=\"#333\"",
			" custom=\"{{false}}\"",
			">",
			"<!-- <l-icon",
			" slot=\"icon\"",
			" name=\"add\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			"/> -->",
			"{{item.value}}",
			"</l-checkbox>",
			"</l-checkbox-group>",
			"<!-- data: {",
			"items: [",
			"{ value: '美国', isChecked: false, disabled: false },",
			"{ value: '中国', isChecked: false, disabled: false },",
			"]",
			"} -->",
			"<!-- bind:linchange 点击时触发 选中项发生变化时触发 linchange 事件,event.detail = {key: 选中项Checkbox的key, cell: checkbox-group传入的cell属性,checked: 按钮切换后的状态}",
			"bind:linout 当设置了min-selected或者max-selected,选中数量不满足要求时触发 linout 事件 event.detail = {key:当前点击checkbox的key, limitNumber: 选项个数限制的值, type: 数量溢出的类型,可选值 overflow_max_selected/overflow_min_selected} -->",
		],
		"description": "Lin UI复选框容器组件代码片段"
	},
	"Lin UI复选框组件Snippet": {
		"prefix": "wl-checkbox",
		"body": [
			"<l-checkbox",
			" placement=\"left|right\"",
			" wx:for-items=\"{{countries}}\"",
			" wx:key=\"{{item.value}}\"",
			" key=\"{{item.value}}\"",
			" checked=\"{{item.isChecked}}\"",
			" disabled=\"{{item.disabled}}\"",
			" size=\"38rpx\"",
			" color=\"red\"",
			" selected-color=\"green\"",
			" disabled-color=\"#333\"",
			" custom=\"{{false}}\"",
			">",
			"<!-- <l-icon",
			" slot=\"icon\"",
			" name=\"add\"",
			" color=\"#34BFA3\"",
			" size=\"30\"",
			"/> -->",
			"{{item.value}}",
			"</l-checkbox>",
		],
		"description": "Lin UI复选框组件代码片段"
	},
	"Lin UI图片选择器组件Snippet": {
		"prefix": "wl-image-picker",
		"body": [
			"<l-image-picker",
			" count=\"9\"",
			" size=\"3\"",
			" urls=\"{{images}}\"",
			" preview=\"{{true}}\"",
			" remove=\"{{true}}\"",
			" size-type=\"{{['original', 'compressed']}}\"",
			" max-image-size=\"10000000\"",
			" bind:linchange=\"onImagePickerChange\"",
			" bind:linremove=\"handleEvent\"",
			" bind:linpreview=\"handleEvent\"",
			" bind:linclear=\"handleEvent\"",
			" bind:linoversize=\"handleEvent\"",
			" bind:linremovetap=\"handleEvent\"",
			">",
			"<!-- 通过 <slot> 的方式可以自定义ImagePicker组件的添加图片部分 -->",
			"</l-image-picker>",
			"<!-- bind:linchange 新增图片时触发 选中项发生变化时触发 linchange 事件,event.detail = {current: [ 新增项的url信息 ], all: [ 当前urls值 ]} urls格式为字符串数组",
			"bind:linremove 移除图片时触发 图片移除时触发 linremove 事件,event.detail = {current: 移除项的url信息, all: [ 当前urls 值 ], index: 移除项的下标} urls格式为字符串数组",
			"bind:linpreview 图片被点击时(预览)触发 图片预览触发 linpreview 事件,event.detail = {current:[ 当前点击项的url信息 ], all: [ 当前urls值 ], index: 点击项的下标} urls格式为字符串数组",
			"bind:linclear 清除图片全部时触发 图片移除时触发 linclear 事件,event.detail = {current: [ 移除项的url信息 ], all: [ 删 除前urls值 ]} urls格式为字符串数组",
			"bind:linoversize 新增图片大小超过max-image-size设置的值时触发 event.detail = {all:[当前urls值],oversize:[超过max-image-size限制的图片值],current:[当前值]}",
			"bind:linremovetap 点击删除按钮 -->",
		],
		"description": "Lin UI图片选择器组件代码片段"
	},
	"Lin UI评分组件Snippet": {
		"prefix": "wl-rate",
		"body": [
			"<l-rate",
			" count=\"5\"",
			" name=\"like\"",
			" active-color=\"#FFDD55\"",
			" inActive-color=\"#FFF5CE\"",
			" score=\"{{rateScore}}\"",
			" size=\"56\"",
			" item-gap=\"10\"",
			" disabled=\"{{false}}\"",
			" bind:linchange=\"handleEvent\"",
			"/>",
			"<l-rate",
			" count=\"5\"",
			" name=\"like\"",
			" active-image=\"激活图片绝对路径\"",
			" inActive-image=\"未激活图片绝对路径\"",
			" score=\"{{rateScore}}\"",
			" size=\"56\"",
			" item-gap=\"10\"",
			" disabled=\"{{false}}\"",
			" bind:linchange=\"handleEvent\"",
			"/>",
			"<!-- bind:linchange 单击选中评分时触发 当前选择的个数 score -->",
		],
		"description": "Lin UI评分组件代码片段"
	},
	"Lin UI表单组件Snippet": {
		"prefix": "wl-form",
		"body": [
			"<l-form",
			" name=\"formName\"",
			" is-submit-validate=\"{{true}}\"",
			" bind:linsubmit=\"handleEvent\"",
			" bind:linreset=\"handleEvent\"",
			">",
			"<l-form-item",
			" label=\"标签名称\"",
			" label-width=\"300rpx\"",
			" label-placement=\"column|row\"",
			" align-items=\"start|centre|end\"",
			" name=\"formItemName-required\"",
			" label-slot=\"{{false}}\"",
			" tip-type=\"text|toast|message\"",
			">",
			"<!-- <view slot=\"label\">插槽标签名称</view> -->",
			"<l-input",
			" id=\"formItemName-required\"",
			" value=\"{{value}}\"",
			" hide-label=\"{{true}}\"",
			" show-row=\"{{false}}\"",
			"/>",
			"</l-form-item>",
			"<view slot=\"submit\">",
			"<l-button>提交</l-button>",
			"</view>",
			"<view slot=\"reset\">",
			"<l-button type=\"default\" plain>重置</l-button>",
			"</view>",
			"<!-- <view slot=\"submit-front\">提交按钮之前的区域</view> -->",
			"<!-- <view slot=\"reset-front\">重置按钮之前的区域</view> -->",
			"<!-- <view slot=\"reset-behind\">重置按钮之后的区</view> -->",
			"</l-form>",
			"<!-- 表单使用需要有以下注意:",
			"1.使用 form 组件时需要在 onLoad 中调用 wx.lin.initValidateForm(this)进行初始化。",
			"2.需要给 form 组件设置 name 属性。当用户手动提交表单的时候需要传入表单 name。例:",
			"<l-form name=\"student\" />",
			"3.需要给 form-Item 设置 name 属性。name 的值将作为提交表单时返回的 Key 。例:",
			"<l-form-item name=\"studentName\" />",
			"4.每一个表单控件必须设置一个 id 属性,且属性值必需与 form-Item 的 name 属性值相同。id属性用于通过selectComponent获取表 单域的值。 例:",
			"<l-form-item name=\"studentName\">",
			"<l-input id=\"studentName\" />",
			"</l-form-item> -->",
			"<!-- bind:linsubmit 点击提交按钮时触发 点击提交时触发 linsubmit 事件,event.detail = {values: 整个表单项的value, errors: 表单内各字段的校验结果,isValidate: 表单是否验证通过}",
			"bind:linreset 点击重置按钮时触发 -->",
		],
		"description": "Lin UI表单组件代码片段"
	},
	"Lin UI表单元素组件Snippet": {
		"prefix": "wl-form-item",
		"body": [
			"<l-form-item",
			" label=\"标签名称\"",
			" label-width=\"300rpx\"",
			" label-placement=\"column|row\"",
			" align-items=\"start|centre|end\"",
			" name=\"formItemName-required\"",
			" label-slot=\"{{false}}\"",
			" tip-type=\"text|toast|message\"",
			">",
			"<!-- <view slot=\"label\">插槽标签名称</view> -->",
			"<l-input",
			" id=\"formItemName-required\"",
			" value=\"{{value}}\"",
			" hide-label=\"{{true}}\"",
			" show-row=\"{{false}}\"",
			"/>",
			"</l-form-item>",
		],
		"description": "Lin UI表单元素代码片段"
	},
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值