| | |
| | | <template> |
| | | <el-date-picker |
| | | <!-- <el-date-picker |
| | | v-model="value1" |
| | | type="date" |
| | | placeholder="选择日期" |
| | | value-format="yyyy-MM-dd" |
| | | /> |
| | | /> --> |
| | | <el-date-picker |
| | | v-model="value1" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | value-format="yyyy-MM-dd HH" |
| | | end-placeholder="结束日期" |
| | | :picker-options="pickerOptions" |
| | | > |
| | | </el-date-picker> |
| | | </template> |
| | | |
| | | <script> |
| | |
| | | // 例如:import《组件名称》from'《组件路径》'; |
| | | |
| | | export default { |
| | | // import 引入的组件需要注入到对象中才能使用 |
| | | // import 引入的组件需要注入到对象中才能使用 |
| | | components: {}, |
| | | props: { |
| | | // value1: String |
| | |
| | | // 这里存放数据 |
| | | return { |
| | | // newValue1: '' |
| | | value1: '' |
| | | value1: '', |
| | | pickerOptions: { |
| | | disabledDate: (time) => { |
| | | return time.getTime() > new Date() |
| | | }, |
| | | }, |
| | | } |
| | | }, |
| | | // 计算属性 类似于data概念 |
| | |
| | | value1(nv, ov) { |
| | | // this.newValue1 = nv |
| | | this.sendPicker() |
| | | } |
| | | }, |
| | | }, |
| | | // 生命周期 - 创建完成(可以访问当前 this 实例) |
| | | created() { |
| | | |
| | | }, |
| | | created() {}, |
| | | // 生命周期 - 挂载完成(可以访问 DOM 元素) |
| | | mounted() { |
| | | mounted() {}, |
| | | |
| | | }, |
| | | beforeCreate() {}, // 生命周期 - 创建之前 |
| | | beforeMount() {}, // 生命周期 - 挂载之前 |
| | | beforeUpdate() {}, // 生命周期 - 更新之前 |
| | |
| | | methods: { |
| | | sendPicker() { |
| | | this.$emit('sendPickerChild', this.value1) |
| | | } |
| | | } // 如果页面有keep-alive缓存功能,这个函数会触发 |
| | | }, |
| | | }, // 如果页面有keep-alive缓存功能,这个函数会触发 |
| | | } |
| | | </script> |
| | | <style scoped> |
| | | |
| | | </style> |