45 lines
1.2 KiB
Vue
45 lines
1.2 KiB
Vue
<template>
|
|
<div class="respond-add flexcenter" @click="open">
|
|
<img class="respond-add-icon" src="@/img/plus-sign.svg" />
|
|
<template v-if="selectEomjiPop">
|
|
<div class="respond-list-mask" @click.stop="close"></div>
|
|
<div class="respond-list-box" @click.stop="">
|
|
<div class="respond-list-title">选择你的回应：</div>
|
|
<div class="respond-list">
|
|
<template v-for="item in riposteoptions" :key="item">
|
|
<div class="respond-item" v-for="(item, key) in item.data" :key="key" v-html="jointriposte(key)" @click="selectEomji(key)"></div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
riposteoptions: Array,
|
|
index: Number,
|
|
})
|
|
|
|
const open = () => {
|
|
selectEomjiPop.value = true
|
|
}
|
|
|
|
const close = () => {
|
|
selectEomjiPop.value = false
|
|
}
|
|
|
|
let selectEomjiPop = ref(false)
|
|
const emit = defineEmits(["selectEomji"])
|
|
|
|
const selectEomji = key => {
|
|
close()
|
|
emit("selectEomji", key, props.index, true)
|
|
}
|
|
|
|
const jointriposte = item => {
|
|
return `&#x${item};`
|
|
}
|
|
</script>
|
|
<style scoped></style>
|