xiugai
This commit is contained in:
parent
0718254027
commit
e223c14d7e
|
@ -0,0 +1,9 @@
|
||||||
|
import Input from './src'
|
||||||
|
|
||||||
|
// 为组件提供 install 安装方法,供按需引入
|
||||||
|
Input.install = function (Vue) {
|
||||||
|
Vue.component(Input.name, Input)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出组件
|
||||||
|
export default Input
|
|
@ -0,0 +1,75 @@
|
||||||
|
<template>
|
||||||
|
<el-input
|
||||||
|
class="ag_input"
|
||||||
|
:style="{ width }"
|
||||||
|
:value="value"
|
||||||
|
:size="size"
|
||||||
|
v-on="inputListeners"
|
||||||
|
v-bind="[$attrs]"
|
||||||
|
>
|
||||||
|
<slot name="append" slot="append" />
|
||||||
|
<slot name="prefix" slot="prefix" />
|
||||||
|
<slot name="suffix" slot="suffix" />
|
||||||
|
<slot name="prepend" slot="prepend" />
|
||||||
|
</el-input>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
/**
|
||||||
|
* WInput
|
||||||
|
* @desc 处理输入的输入框(转大写,不能有中文空格等)
|
||||||
|
*/
|
||||||
|
export default {
|
||||||
|
name: "AgInput",
|
||||||
|
props: {
|
||||||
|
width: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
},
|
||||||
|
size: {
|
||||||
|
type: String,
|
||||||
|
default: "small",
|
||||||
|
},
|
||||||
|
value: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
},
|
||||||
|
toUpperCase: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
// 所有父级事件
|
||||||
|
inputListeners() {
|
||||||
|
return Object.assign(
|
||||||
|
{},
|
||||||
|
// 我们从父级添加所有的监听器
|
||||||
|
this.$listeners,
|
||||||
|
// 然后我们添加自定义监听器,
|
||||||
|
// 或覆写一些监听器的行为
|
||||||
|
{
|
||||||
|
// 这里确保组件配合 `v-model` 的工作
|
||||||
|
input: (value) => {
|
||||||
|
this.$emit("input", this.toUpperCase ? value.toUpperCase() : value);
|
||||||
|
},
|
||||||
|
blur: (e) => {
|
||||||
|
let value = e.target.value
|
||||||
|
.trim()
|
||||||
|
.replace(/\s/g, (match) =>
|
||||||
|
match.charCodeAt(0) === 12288 ? String.fromCharCode(32) : match
|
||||||
|
);
|
||||||
|
|
||||||
|
// 失去焦点自动首位去空格
|
||||||
|
this.$emit("input", value);
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped></style>
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
// import pedestal from './src'
|
||||||
|
|
||||||
|
// // 为组件提供 install 安装方法,供按需引入
|
||||||
|
// pedestal.install = function (Vue) {
|
||||||
|
// Vue.component(pedestal.name, pedestal)
|
||||||
|
// }
|
||||||
|
|
||||||
|
// // 导出组件
|
||||||
|
// export default pedestal
|
|
@ -0,0 +1,18 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<h1>主组件</h1>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
components: {},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang='scss'>
|
||||||
|
</style>
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<el-input
|
<el-input
|
||||||
class="w-input"
|
class="ag_input"
|
||||||
:style="{ width }"
|
:style="{ width }"
|
||||||
:value="value"
|
:value="value"
|
||||||
:size="size"
|
:size="size"
|
||||||
|
@ -20,11 +20,11 @@
|
||||||
* @desc 处理输入的输入框(转大写,不能有中文空格等)
|
* @desc 处理输入的输入框(转大写,不能有中文空格等)
|
||||||
*/
|
*/
|
||||||
export default {
|
export default {
|
||||||
name: "WInput",
|
name: "AgInput",
|
||||||
props: {
|
props: {
|
||||||
width: {
|
width: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "180px",
|
default: "",
|
||||||
},
|
},
|
||||||
size: {
|
size: {
|
||||||
type: String,
|
type: String,
|
||||||
|
@ -36,7 +36,7 @@ export default {
|
||||||
},
|
},
|
||||||
toUpperCase: {
|
toUpperCase: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Pedestal ref="ref_Pedestal" v-model="value">
|
<Pedestal ref="ref_Pedestal" v-model="value" @input="changeInput">
|
||||||
<!-- <template #operate="">
|
<!-- <template #operate="">
|
||||||
<el-button
|
<el-button
|
||||||
class="excel"
|
class="excel"
|
||||||
|
@ -42,7 +42,11 @@ export default {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {},
|
methods: {
|
||||||
|
changeInput() {
|
||||||
|
console.log(this.value);
|
||||||
|
},
|
||||||
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,13 +0,0 @@
|
||||||
function cloneDeep(obj, hash = new WeakMap()) {
|
|
||||||
if (obj == null || typeof obj !== 'object') return obj
|
|
||||||
if (obj instanceof Date) return new Date(obj)
|
|
||||||
if (obj instanceof RegExp) return new RegExp(obj.source, obj.flags)
|
|
||||||
if (hash.has(obj)) return hash.get(obj)
|
|
||||||
let deepObj = Array.isArray(obj) ? [] : Object.create(Object.getPrototypeOf(obj))
|
|
||||||
hash.set(obj, deepObj)
|
|
||||||
|
|
||||||
for (const key in obj) {
|
|
||||||
deepObj[key] = cloneDeep(obj[key], hash)
|
|
||||||
}
|
|
||||||
return deepObj
|
|
||||||
}
|
|
Loading…
Reference in New Issue