ant-design-vue
Version:
An enterprise-class UI design language and Vue-based implementation
226 lines (210 loc) • 7.7 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _vue = require("vue");
var _ = _interopRequireWildcard(require(".."));
require("../assets/index.less");
require("./single.less");
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
/* eslint-disable no-console */
function _isSlot(s) {
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0, _vue.isVNode)(s);
}
var Test = (0, _vue.defineComponent)({
data: function data() {
return {
destroy: false,
value: '9'
};
},
methods: {
onChange: function onChange(e) {
var value;
if (e && e.target) {
value = e.target.value;
} else {
value = e;
}
console.log('onChange', value);
this.value = value;
},
onDestroy: function onDestroy() {
this.destroy = 1;
},
onBlur: function onBlur(v) {
console.log('onBlur', v);
},
onFocus: function onFocus() {
console.log('onFocus');
},
onSearch: function onSearch(val) {
console.log('Search:', val);
}
},
render: function render() {
var _slot, _slot2;
var value = this.value,
destroy = this.destroy;
if (destroy) {
return null;
}
return (0, _vue.createVNode)("div", {
"style": {
margin: '20px'
}
}, [(0, _vue.createVNode)("div", {
"style": {
height: '150px',
background: 'rgba(0, 255, 0, 0.1)'
},
"onMousedown": function onMousedown(e) {
e.preventDefault();
}
}, [(0, _vue.createTextVNode)("Prevent Default")]), (0, _vue.createVNode)("h2", null, [(0, _vue.createTextVNode)("Single Select")]), (0, _vue.createVNode)("div", {
"style": {
width: '300px'
}
}, [(0, _vue.createVNode)(_.default, {
"autofocus": true,
"id": "my-select",
"value": value,
"placeholder": "placeholder",
"showSearch": true,
"style": {
width: '500px'
},
"onBlur": this.onBlur,
"onFocus": this.onFocus,
"onSearch": this.onSearch,
"allowClear": true,
"optionFilterProp": "text",
"onChange": this.onChange,
"onPopupScroll": function onPopupScroll() {
console.log('Scroll!');
}
}, {
default: function _default() {
return [(0, _vue.createVNode)(_.Option, {
"value": null
}, {
default: function _default() {
return [(0, _vue.createTextVNode)("\u4E0D\u9009\u62E9")];
}
}), (0, _vue.createTextVNode)(","), (0, _vue.createVNode)(_.Option, {
"value": "01",
"text": "jack",
"title": "jack"
}, _isSlot(_slot = (0, _vue.createVNode)("b", {
"style": {
color: 'red'
}
}, [(0, _vue.createTextVNode)("jack")])) ? _slot : {
default: function _default() {
return [_slot];
}
}), (0, _vue.createTextVNode)(","), (0, _vue.createVNode)(_.Option, {
"value": "11",
"text": "lucy"
}, _isSlot(_slot2 = (0, _vue.createVNode)("span", null, [(0, _vue.createTextVNode)("lucy")])) ? _slot2 : {
default: function _default() {
return [_slot2];
}
}), (0, _vue.createTextVNode)(","), (0, _vue.createVNode)(_.Option, {
"value": "21",
"disabled": true,
"text": "disabled"
}, {
default: function _default() {
return [(0, _vue.createTextVNode)("disabled")];
}
}), (0, _vue.createTextVNode)(","), (0, _vue.createVNode)(_.Option, {
"value": "31",
"text": "yiminghe",
"class": "test-option",
"style": {
background: 'yellow'
}
}, {
default: function _default() {
return [(0, _vue.createTextVNode)("yiminghe")];
}
}), (0, _vue.createTextVNode)(","), [0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map(function (i) {
return (0, _vue.createVNode)(_.Option, {
"key": i,
"value": String(i),
"text": String(i)
}, {
default: function _default() {
return [i, (0, _vue.createTextVNode)("-text")];
}
});
})];
}
})]), (0, _vue.createVNode)("h2", null, [(0, _vue.createTextVNode)("native select")]), (0, _vue.createVNode)("select", {
"value": value,
"style": {
width: '500px'
},
"onChange": this.onChange
}, [(0, _vue.createVNode)("option", {
"value": "01"
}, [(0, _vue.createTextVNode)("jack")]), (0, _vue.createVNode)("option", {
"value": "11"
}, [(0, _vue.createTextVNode)("lucy")]), (0, _vue.createVNode)("option", {
"value": "21",
"disabled": true
}, [(0, _vue.createTextVNode)("disabled")]), (0, _vue.createVNode)("option", {
"value": "31"
}, [(0, _vue.createTextVNode)("yiminghe")]), [1, 2, 3, 4, 5, 6, 7, 8, 9].map(function (i) {
return (0, _vue.createVNode)("option", {
"value": i,
"key": i
}, _isSlot(i) ? i : {
default: function _default() {
return [i];
}
});
})]), (0, _vue.createVNode)("h2", null, [(0, _vue.createTextVNode)("RTL Select")]), (0, _vue.createVNode)("div", {
"style": {
width: '300px'
}
}, [(0, _vue.createVNode)(_.default, {
"id": "my-select-rtl",
"placeholder": "rtl",
"direction": "rtl",
"dropdownMatchSelectWidth": 300,
"dropdownStyle": {
minWidth: '300px'
},
"style": {
width: '500px'
}
}, {
default: function _default() {
return [(0, _vue.createVNode)(_.Option, {
"value": "1"
}, {
default: function _default() {
return [(0, _vue.createTextVNode)("1")];
}
}), (0, _vue.createVNode)(_.Option, {
"value": "2"
}, {
default: function _default() {
return [(0, _vue.createTextVNode)("2")];
}
})];
}
})]), (0, _vue.createVNode)("p", null, [(0, _vue.createVNode)("button", {
"type": "button",
"onClick": this.onDestroy
}, [(0, _vue.createTextVNode)("destroy")])])]);
}
});
var _default2 = Test;
/* eslint-enable */
exports.default = _default2;