diff --git a/.eslintrc b/.eslintrc index 85a29000c..b5c73721e 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,4 +1,5 @@ { + "root": true, "env": { "browser": true, "node": true, @@ -6,14 +7,18 @@ "jest": true, "es6": true }, - "parser": "babel-eslint", - "extends": ["plugin:vue-libs/recommended", "prettier"], + "parserOptions": { + "parser": "babel-eslint" + }, + "extends": ["plugin:vue/recommended", "prettier"], "rules": { "comma-dangle": [2, "always-multiline"], "no-var": "error", - "no-unused-vars": "warn", "camelcase": "off", "no-extra-boolean-cast": "off", - "semi": ["error", "always"] + "semi": ["error", "always"], + "vue/require-prop-types": "off", + "vue/require-default-prop": "off", + "vue/no-reserved-keys": "off" } -} \ No newline at end of file +} diff --git a/.jest.js b/.jest.js index 37fd6d5e8..f49e23973 100644 --- a/.jest.js +++ b/.jest.js @@ -28,7 +28,8 @@ module.exports = { : '.*\\.test\\.js$', moduleNameMapper: { "^@/(.*)$": "/$1", - "ant-design-vue": "/components/index.js" + "ant-design-vue": "/components/index.js", + "^vue$": "vue/dist/vue.common.js" }, snapshotSerializers: ["/node_modules/jest-serializer-vue"], collectCoverage: process.env.COVERAGE === 'true', diff --git a/components/_util/ContainerRender.jsx b/components/_util/ContainerRender.jsx index 958c58a5a..5dd80381c 100644 --- a/components/_util/ContainerRender.jsx +++ b/components/_util/ContainerRender.jsx @@ -53,11 +53,11 @@ export default { if (!this._component) { this._component = new Vue({ + el: el, + parent: self.parent, data: { comProps: props, }, - parent: self.parent, - el: el, mounted() { this.$nextTick(() => { if (ready) { diff --git a/components/_util/FormDecoratorDirective.js b/components/_util/FormDecoratorDirective.js index bfe9aa857..7abde9954 100644 --- a/components/_util/FormDecoratorDirective.js +++ b/components/_util/FormDecoratorDirective.js @@ -4,7 +4,7 @@ export function antDecorator(Vue) { export default { // just for tag - install: (Vue, options) => { + install: Vue => { antDecorator(Vue); }, }; diff --git a/components/_util/antDirective.js b/components/_util/antDirective.js index 08c416a14..cda6a3ab8 100644 --- a/components/_util/antDirective.js +++ b/components/_util/antDirective.js @@ -2,7 +2,7 @@ import { antInput } from './antInputDirective'; import { antDecorator } from './FormDecoratorDirective'; export default { - install: (Vue, options) => { + install: Vue => { antInput(Vue); antDecorator(Vue); }, diff --git a/components/_util/antInputDirective.js b/components/_util/antInputDirective.js index d4695057a..abbb4d7fe 100644 --- a/components/_util/antInputDirective.js +++ b/components/_util/antInputDirective.js @@ -46,7 +46,7 @@ if (isIE9) { export function antInput(Vue) { return Vue.directive('ant-input', { - inserted(el, binding, vnode, oldVnode) { + inserted(el, binding, vnode) { if (vnode.tag === 'textarea' || isTextInputType(el.type)) { if (!binding.modifiers || !binding.modifiers.lazy) { el.addEventListener('compositionstart', onCompositionStart); @@ -67,7 +67,7 @@ export function antInput(Vue) { } export default { - install: (Vue, options) => { + install: Vue => { antInput(Vue); }, }; diff --git a/components/_util/openAnimation.js b/components/_util/openAnimation.js index 05c82c4fc..033582d0a 100644 --- a/components/_util/openAnimation.js +++ b/components/_util/openAnimation.js @@ -1,7 +1,7 @@ import cssAnimation from './css-animation'; import raf from 'raf'; -function animate(node, show, done, type) { +function animate(node, show, done) { let height; let requestAnimationFrameId; let appearRequestAnimationFrameId; diff --git a/components/_util/props-util.js b/components/_util/props-util.js index a977c9e19..8e94a5474 100644 --- a/components/_util/props-util.js +++ b/components/_util/props-util.js @@ -250,7 +250,7 @@ const initDefaultProps = (propTypes, defaultProps) => { export function mergeProps() { const args = [].slice.call(arguments, 0); const props = {}; - args.forEach((p = {}, i) => { + args.forEach((p = {}) => { for (const [k, v] of Object.entries(p)) { props[k] = props[k] || {}; if (isPlainObject(v)) { diff --git a/components/_util/vue-types/index.js b/components/_util/vue-types/index.js index a53d6afc9..c92958ef7 100644 --- a/components/_util/vue-types/index.js +++ b/components/_util/vue-types/index.js @@ -111,7 +111,7 @@ const VuePropTypes = { let hasCustomValidators = false; - const nativeChecks = arr.reduce((ret, type, i) => { + const nativeChecks = arr.reduce((ret, type) => { if (isPlainObject(type)) { if (type._vueTypes_name === 'oneOf') { return ret.concat(type.type || []); diff --git a/components/_util/warning.js b/components/_util/warning.js index 7a12dde23..35d813386 100644 --- a/components/_util/warning.js +++ b/components/_util/warning.js @@ -1,7 +1,7 @@ import warning from 'warning'; const warned = {}; -export default (valid, message, throwError) => { +export default (valid, message) => { if (!valid && !warned[message]) { warning(false, message); warned[message] = true; diff --git a/components/affix/index.jsx b/components/affix/index.jsx index dcdc9f970..e35990c35 100644 --- a/components/affix/index.jsx +++ b/components/affix/index.jsx @@ -81,10 +81,10 @@ const Affix = { // Mock Event object. this.updatePosition({}); }, - offsetTop(val) { + offsetTop() { this.updatePosition({}); }, - offsetBottom(val) { + offsetBottom() { this.updatePosition({}); }, }, diff --git a/components/anchor/AnchorLink.jsx b/components/anchor/AnchorLink.jsx index 73bd3efc3..c683e69e5 100644 --- a/components/anchor/AnchorLink.jsx +++ b/components/anchor/AnchorLink.jsx @@ -18,6 +18,12 @@ export default { antAnchor: { default: () => ({}) }, antAnchorContext: { default: () => ({}) }, }, + watch: { + href(val, oldVal) { + this.antAnchor.unregisterLink(oldVal); + this.antAnchor.registerLink(val); + }, + }, mounted() { this.antAnchor.registerLink(this.href); @@ -26,12 +32,6 @@ export default { beforeDestroy() { this.antAnchor.unregisterLink(this.href); }, - watch: { - href(val, oldVal) { - this.antAnchor.unregisterLink(oldVal); - this.antAnchor.registerLink(val); - }, - }, methods: { handleClick(e) { this.antAnchor.scrollTo(this.href); diff --git a/components/auto-complete/__tests__/index.test.js b/components/auto-complete/__tests__/index.test.js index 8fdad0104..381e1b800 100644 --- a/components/auto-complete/__tests__/index.test.js +++ b/components/auto-complete/__tests__/index.test.js @@ -11,7 +11,7 @@ describe('AutoComplete with Custom Input Element Render', () => { it('AutoComplete with custom Input render perfectly', done => { const wrapper = mount( { - render(h) { + render() { return ( diff --git a/components/button/__tests__/index.test.js b/components/button/__tests__/index.test.js index c32e78ecc..b359e593a 100644 --- a/components/button/__tests__/index.test.js +++ b/components/button/__tests__/index.test.js @@ -16,7 +16,7 @@ describe('Button', () => { it('create primary button', () => { const wrapper = mount({ - render(h) { + render() { return ; }, }); @@ -25,14 +25,14 @@ describe('Button', () => { it('renders Chinese characters correctly', done => { const wrapper = mount({ - render(h) { + render() { return ; }, }); expect(wrapper.text()).toBe('按 钮'); const wrapper1 = mount({ - render(h) { + render() { return ; }, }); @@ -40,7 +40,7 @@ describe('Button', () => { expect(wrapper1.html()).toMatchSnapshot(); const wrapper2 = mount({ - render(h) { + render() { return ( ; }, }); expect(wrapper3.html()).toMatchSnapshot(); // should not insert space when there is icon while loading const wrapper4 = mount({ - render(h) { + render() { return ( ; }, }); expect(wrapper5.html()).toMatchSnapshot(); const wrapper6 = mount({ - render(h) { + render() { return ( ; }, }); expect(wrapper.html()).toMatchSnapshot(); const wrapper1 = mount({ - render(h) { + render() { return ; }, }); expect(wrapper1.html()).toMatchSnapshot(); const wrapper2 = mount({ - render(h) { + render() { return ; }, }); diff --git a/components/button/button.jsx b/components/button/button.jsx index 82b29d2af..3c9355e8a 100644 --- a/components/button/button.jsx +++ b/components/button/button.jsx @@ -6,8 +6,8 @@ import buttonTypes from './buttonTypes'; import { filterEmpty } from '../_util/props-util'; const props = buttonTypes(); export default { - inheritAttrs: false, name: 'AButton', + inheritAttrs: false, __ANT_BUTTON: true, props, data() { @@ -21,32 +21,6 @@ export default { hasTwoCNChar: false, }; }, - mounted() { - this.fixTwoCNChar(); - }, - updated() { - this.fixTwoCNChar(); - }, - beforeDestroy() { - // if (this.timeout) { - // clearTimeout(this.timeout) - // } - if (this.delayTimeout) { - clearTimeout(this.delayTimeout); - } - }, - watch: { - loading(val) { - clearTimeout(this.delayTimeout); - if (typeof val !== 'boolean' && val && val.delay) { - this.delayTimeout = setTimeout(() => { - this.sLoading = !!val; - }, val.delay); - } else { - this.sLoading = !!val; - } - }, - }, computed: { classes() { const { @@ -77,6 +51,32 @@ export default { }; }, }, + watch: { + loading(val) { + clearTimeout(this.delayTimeout); + if (typeof val !== 'boolean' && val && val.delay) { + this.delayTimeout = setTimeout(() => { + this.sLoading = !!val; + }, val.delay); + } else { + this.sLoading = !!val; + } + }, + }, + mounted() { + this.fixTwoCNChar(); + }, + updated() { + this.fixTwoCNChar(); + }, + beforeDestroy() { + // if (this.timeout) { + // clearTimeout(this.timeout) + // } + if (this.delayTimeout) { + clearTimeout(this.delayTimeout); + } + }, methods: { fixTwoCNChar() { // Fix for HOC usage like diff --git a/components/checkbox/Checkbox.jsx b/components/checkbox/Checkbox.jsx index 6858f010f..b300adfe5 100644 --- a/components/checkbox/Checkbox.jsx +++ b/components/checkbox/Checkbox.jsx @@ -5,8 +5,11 @@ import { getOptionProps, getAttrs } from '../_util/props-util'; function noop() {} export default { - inheritAttrs: false, name: 'ACheckbox', + inheritAttrs: false, + model: { + prop: 'checked', + }, props: { prefixCls: { default: 'ant-checkbox', @@ -23,9 +26,6 @@ export default { type: PropTypes.string.def('checkbox'), autoFocus: Boolean, }, - model: { - prop: 'checked', - }, inject: { checkboxGroupContext: { default: () => null }, }, diff --git a/components/checkbox/Group.jsx b/components/checkbox/Group.jsx index dec323e9f..21e74b3a5 100644 --- a/components/checkbox/Group.jsx +++ b/components/checkbox/Group.jsx @@ -3,6 +3,9 @@ import hasProp from '../_util/props-util'; function noop() {} export default { name: 'ACheckboxGroup', + model: { + prop: 'value', + }, props: { prefixCls: { default: 'ant-checkbox', @@ -22,9 +25,6 @@ export default { }, disabled: Boolean, }, - model: { - prop: 'value', - }, provide() { return { checkboxGroupContext: this, diff --git a/components/date-picker/RangePicker.jsx b/components/date-picker/RangePicker.jsx index ea22aa4cb..f9665d00f 100644 --- a/components/date-picker/RangePicker.jsx +++ b/components/date-picker/RangePicker.jsx @@ -66,18 +66,18 @@ function fixLocale(value, localeCode) { } export default { - mixins: [BaseMixin], name: 'ARangePicker', + mixins: [BaseMixin], + model: { + prop: 'value', + event: 'change', + }, props: initDefaultProps(RangePickerProps(), { prefixCls: 'ant-calendar', tagPrefixCls: 'ant-tag', allowClear: true, showToday: false, }), - model: { - prop: 'value', - event: 'change', - }, data() { const value = this.value || this.defaultValue || []; const [start, end] = value; diff --git a/components/date-picker/WeekPicker.jsx b/components/date-picker/WeekPicker.jsx index 80d38b62a..912efbd9a 100644 --- a/components/date-picker/WeekPicker.jsx +++ b/components/date-picker/WeekPicker.jsx @@ -26,16 +26,16 @@ export default { // }; // private input: any; - props: initDefaultProps(WeekPickerProps(), { - format: 'gggg-wo', - allowClear: true, - }), name: 'AWeekPicker', mixins: [BaseMixin], model: { prop: 'value', event: 'change', }, + props: initDefaultProps(WeekPickerProps(), { + format: 'gggg-wo', + allowClear: true, + }), data() { const value = this.value || this.defaultValue; if (value && !interopDefault(moment).isMoment(value)) { diff --git a/components/drawer/demo/descriptionItem.vue b/components/drawer/demo/descriptionItem.vue index 3c634ad58..18e85a11a 100644 --- a/components/drawer/demo/descriptionItem.vue +++ b/components/drawer/demo/descriptionItem.vue @@ -1,15 +1,20 @@ diff --git a/components/form/demo/dynamic-form-item.vue b/components/form/demo/dynamic-form-item.vue index 10cce1968..3919d4ae4 100644 --- a/components/form/demo/dynamic-form-item.vue +++ b/components/form/demo/dynamic-form-item.vue @@ -10,56 +10,64 @@ Add or remove form items dynamically. diff --git a/components/form/demo/global-state.vue b/components/form/demo/global-state.vue index 1e17cd3b5..46c73c0b0 100644 --- a/components/form/demo/global-state.vue +++ b/components/form/demo/global-state.vue @@ -18,13 +18,13 @@ But if you use `this.$form.createForm`, You can use any data, not just the prope @@ -77,6 +77,9 @@ const CustomizedForm = { }; export default { + components: { + CustomizedForm, + }, data () { return { fields: { @@ -92,9 +95,6 @@ export default { this.fields = { ...this.fields, ...changedFields }; }, }, - components: { - CustomizedForm, - }, };