Former-commit-id: 7b74bdf25b14c6a8da08ae07075e3f78be308894 [formerly 7b74bdf25b14c6a8da08ae07075e3f78be308894 [formerly 7b74bdf25b14c6a8da08ae07075e3f78be308894 [formerly 7b74bdf25b14c6a8da08ae07075e3f78be308894 [formerly 1e795e1614aaf94f23ad99354f6ca9be303a1b1e [formerly 9ce21aef6b043d8bfcb2849dd7c6bc34e4625387]]]]] Former-commit-id: c92d7410adc4138c7903c0067860fc3d190f54b0 Former-commit-id: 9f0ab819a505e341a6edf210efb107df8b8efe33 Former-commit-id: 3006c0d2ccda4133203372c30ffee34a73fa8944 [formerly f340ca4127e4578b3c53747d13bbaba223ed4e83] Former-commit-id: 9624c2aaa99880b5e37f1e60f1f36ac673e021ed Former-commit-id: 7923489f2c3c637782d9d4a1707bc48dfe3b1acf Former-commit-id: 2375e080a7f715bc48da40d4c56235efad3f0d5d Former-commit-id: c41402e6c0266a07e974efad41feed7c6fb7d0b6 Former-commit-id: b8814b31619151361c91ed37cb1ee7f3813853c1
51 lines
989 B
Vue
51 lines
989 B
Vue
<template>
|
|
<div class="d2-demo-article">
|
|
<div v-if="!long" class="d2-demo-article__control">
|
|
<el-switch
|
|
v-model="isLong"
|
|
active-text="长内容"
|
|
inactive-text="短内容"/>
|
|
</div>
|
|
<d2-markdown v-show="isLong" :source="sourceLong"/>
|
|
<d2-markdown v-show="!isLong" :source="sourceShort"/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import sourceLong from '../md/long.md'
|
|
import sourceShort from '../md/short.md'
|
|
export default {
|
|
props: {
|
|
// 指定为长文本
|
|
long: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
}
|
|
},
|
|
data () {
|
|
return {
|
|
sourceLong,
|
|
sourceShort,
|
|
isLong: false
|
|
}
|
|
},
|
|
created () {
|
|
this.isLong = this.long
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.d2-demo-article {
|
|
transition: opacity .3s;
|
|
.d2-demo-article__control {
|
|
padding: 8px 16px;
|
|
margin-bottom: 10px;
|
|
box-sizing: border-box;
|
|
border-radius: 4px;
|
|
background-color: #f4f4f5;
|
|
}
|
|
}
|
|
</style>
|