study/ClipboardManager
1
0
Fork 0
mirror of https://github.com/ZiuChen/ClipboardManager.git synced 2025-06-11 09:34:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: 优化代码执行细节

Browse Source
This commit is contained in:
ZiuChen 2022-08-15 15:28:40 +08:00
parent 6b63c7a4f7
commit de5ac3476e
1 changed files with 14 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/views/Main.vue
View File

@ -24,18 +24,14 @@ import ClipFullData from '../cpns/ClipFullData.vue'
import ClipSearch from '../cpns/ClipSearch.vue' import ClipSearch from '../cpns/ClipSearch.vue'
import ClipSwitch from '../cpns/ClipSwitch.vue' import ClipSwitch from '../cpns/ClipSwitch.vue'
const ClipSwitchRef = ref() const GAP = 10 // 懒加载 每次添加的条数
const offset = ref(0) // 懒加载 偏移量
const filterText = ref('') // 搜索框绑定值
const list = ref([]) // 全部数据
const showList = ref([]) // 展示的数据
const fullData = ref({ type: 'text', data: '' })
const fullDataShow = ref(false)
const filterText = ref('')
const GAP = 10
const list = ref([])
const showList = ref([])
const offset = ref(0)
const updateShowList = (type) => { const updateShowList = (type) => {
// 更新显示列表
if (type === 'all') { if (type === 'all') {
if (filterText.value) { if (filterText.value) {
// 有过滤词 则过滤掉图片 // 有过滤词 则过滤掉图片
@ -63,9 +59,12 @@ const updateShowList = (type) => {
document.scrollingElement.scrollTop = 0 document.scrollingElement.scrollTop = 0
} }
const fullData = ref({ type: 'text', data: '' })
const fullDataShow = ref(false)
const toggleFullData = (item) => { const toggleFullData = (item) => {
// only text || file // 是否显示全部数据 (查看全部)
const { type, data } = item const { type, data } = item
// type: 'text' | 'file'
if (type === 'text') { if (type === 'text') {
fullData.value.type = 'text' fullData.value.type = 'text'
fullData.value.data = data fullData.value.data = data
@ -77,6 +76,7 @@ const toggleFullData = (item) => {
} }
const restoreDataBase = () => { const restoreDataBase = () => {
// 情况数据库
const flag = window.confirm('确定要清空剪贴板记录吗?') const flag = window.confirm('确定要清空剪贴板记录吗?')
if (flag) { if (flag) {
window.db.emptyDataBase() window.db.emptyDataBase()
@ -84,8 +84,9 @@ const restoreDataBase = () => {
} }
} }
const ClipSwitchRef = ref()
onMounted(() => { onMounted(() => {
// 获取挂载 Ref // 获取挂载的导航组件 Ref
const activeTab = computed(() => ClipSwitchRef.value.activeTab) const activeTab = computed(() => ClipSwitchRef.value.activeTab)
// 初始化数据 // 初始化数据
@ -107,11 +108,7 @@ onMounted(() => {
}, 500) }, 500)
// 监听搜索框 // 监听搜索框
watch(filterText, (val) => { watch(filterText, (val) => updateShowList(activeTab.value))
console.log(val)
console.log(ClipSwitchRef)
updateShowList(activeTab.value)
})
// 列表懒加载 // 列表懒加载
document.addEventListener('scroll', (e) => { document.addEventListener('scroll', (e) => {
@ -175,7 +172,6 @@ onMounted(() => {
transition: all 0.15s; transition: all 0.15s;
} }
} }
.clip-break { .clip-break {
height: 55px; height: 55px;
} }