无锡微信网站建设,域名查询服务器ip,西安免费网站建站模板,建网站可以用企业qq吗不管是移入#xff0c;或者是点击事件
都要知道是触发的哪个组件
这里子组件是个通用小标题title
所以#xff0c;通过标题内容#xff0c;获取触发的哪个子组件子组件
templatediv mouseovertMouseover mouseleavetMouseLeave class或者是点击事件
都要知道是触发的哪个组件
这里子组件是个通用小标题title
所以通过标题内容获取触发的哪个子组件子组件
templatediv mouseovertMouseover mouseleavetMouseLeave classtitle-wrap clickchangeImg:styletitle 铁路 || title 公路 || title 水路 || title 综合交通枢纽 || title 公共交通发展 || title 道路运输 ? cursor: pointer; : span classtext{{ title }}/spandiv classtitle-rightdiv v-if!selectShow!-- span classnum129/spanspan classunit件/span --/divdiv v-elseel-select v-modelsValue placeholder请选择 sizemini changechangeel-option v-foritem in options :keyitem.value :labelitem.label :valueitem.value/el-option/el-select/div/div/div
/templatescript
export default {props: {options: {type: Array,default: () []},title: {type: String,default: },selectShow: {type: Boolean,default: false}},data() {return {sValue: ,a: true}},mounted() {this.sValue this.options[0] ? this.options[0].label : null},methods: {tMouseover() {console.log(this.title);// 通过title可以知道触发某个子组件标题this.$emit(overtitle, this.title)},tMouseLeave() {this.$emit(overtitle, false)},changeImg() {this.$emit(sImg, this.title)},change(e) {console.log(e, e);this.$emit(sValue, this.sValue, this.options[0].label)}}
}
/scriptstyle langscss scoped
.title-wrap {// width: 25.625rem;padding: 8px 0;background: url(/assets/images/组 84612x.png) no-repeat;background-size: 100% 100%;display: flex;align-items: center;justify-content: space-between;// cursor: pointer;.text {margin-left: 1.5rem;font-size: 20px;font-weight: bold;}.title-right {margin-right: 1rem;.num {font-size: 14px;font-family: MiSans, MiSans;font-weight: 500;color: #F3AE30;}.unit {font-size: 12px;font-family: MiSans, MiSans;font-weight: 500;color: #fff;margin-left: .3125rem;}.el-select {width: 9.375rem;}::v-deep .el-input--mini .el-input__inner {background: transparent;color: #fff;border: 1px solid #093B9E;}}
}
/style父组件
Box :widhtclientWidth 3840 ? 40rem : sImgsImg overtitleovertitle :selectShowfalse:title铁路 styleleft: 1.25rem;transition: left 1s ease-in-out;:styleleftShowLength ? left:-25.625rem : /Box
