惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

博客园 - 三生石上(FineUI控件)
D
Docker
GbyAI
GbyAI
宝玉的分享
宝玉的分享
Jina AI
Jina AI
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Vercel News
Vercel News
博客园_首页
Recent Announcements
Recent Announcements
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Hugging Face - Blog
Hugging Face - Blog
腾讯CDC
S
SegmentFault 最新的问题
Microsoft Security Blog
Microsoft Security Blog
酷 壳 – CoolShell
酷 壳 – CoolShell
美团技术团队
V
V2EX
WordPress大学
WordPress大学
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
V
Visual Studio Blog
IT之家
IT之家
Apple Machine Learning Research
Apple Machine Learning Research
T
Tailwind CSS Blog
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com

博客园 - 青争竹马

创建 abp.io Abp VNext 项目 非 Web 应用程序中的用户机密 引用非当前解决方案sln的项目csproj编译报错 Windows 剪贴板与远程桌面共享失效 在浏览器F12中使用debugger调试选择不到的元素 Linux Debian 通过 /etc/profile 设置环境变量 Monorepo 之 Yarn Workspaces 中使用 npm-run-all 一次同时运行多个项目 UniApp 反向代理配置 - 本地开发解决跨域问题 Data is Null. This method or property cannot be called on Null values. Install Kibana with Docker Centos7重装Python和Yum SignalR, No Connection with that ID,IIS SQL Server Management Studio IDE中可以命中的索引是Index Seek但是在写的程序中却是Index Scan ssh-copy-id 之后ssh还是提示输入密码的问题 Docker容器中连接Sql Server数据库报错 provider: SSL Provider, error: 31 - Encryption(ssl/tls) handshake failed cdn.devolutions.net ip foxmail windows 每次打开都需要登录账号 错误 NU1105 找不到“xx.csproj”的项目信息。如果使用 Visual Studio,这可能是因为该项目已被卸载或不属于当前解决方案,因此请从命令行运行还原。否则,项目文件可能无效或缺少还原所需的目标。 xxx xxx.csproj Jenkins 构建踩坑经历 log4net SmtpAppender 踩坑总结
sortablejs 拖拽库 在Vue 组合模式下的使用
青争竹马 · 2026-01-29 · via 博客园 - 青争竹马
<ul ref="listRef">
    <li v-for="(item,index) in dataList" :data-id="item.id" :key="item.index" class="draggable">{{item.sort}}.{{item.name}}<icon class="handle"></icon></li>
</ul>

const dataList = shallowRef([])
const listRef = ref();
onMounted(() => {
    const srotableObj = new Sortable(listRef.value.$el, {
        animation: 150,
        handle: '.handle',
        draggable: '.draggable',
        onEnd: () => {
            const ids = srotableObj.toArray()
            ids.forEach((id, index) => {
                dataList.value.find(x => x.id == id).sort = index + 1;
            })
            triggerRef(dataList);
        }
    });
}

参考文档手册 https://sortablejs.com/

或者使用 Vue.Draggable