Vue 组件 — V - Textcomplete

k00baa 发布于2019-08-20 16:34 / 3095人阅读

摘要：之后，又是一个简单易用灵活的组件。这次我带来了，一个带有文字匹配的。好，废话少说，接下来简单介绍一下如何使用。简单预览最后，欢迎大家来给我提意见，我会不断完善。

V - Distpicker 之后，V - Textcomplete 又是一个简单、易用、灵活的 Vue 组件。

哈，我又来啦。这次我带来了 V - Textcomplete ，一个带有文字匹配的 Textarea。

可能会有人质疑，这东东有什么用？用来干嘛的？

V - Textcomplete 是一个灵活，用起来超级简单的 Vue 组件，设定规则可用于 Emoji 表情的匹配，又或者 @ 某人时匹配当前帖子下活跃用户等，我相信这个功能在现有的很多文本编辑器都已经有了。

然而又会有人质疑，这种插件不是有很多的吗？为何又去造一个这样子的轮子呢？

没错，确实是有不少这种插件，而且也相对成熟，但有没有发现大部分都是依赖 JQuery 的。而我要的是没有 JQuery 而且是一个简单易用的 Vue 组件，掌控在自己手上的。

好，废话少说，接下来简单介绍一下如何使用 V - Textcomplete。

网站：https://textcomplete.iline.co

源码：https://github.com/jcc/v-textcomplete

安装

使用 npm 安装：

npm install v-textcomplete --save

使用 yarn 安装

yarn add v-textcomplete --save

使用 注册组件

注册全局组件

import TextComplete from "v-textcomplete"

Vue.component("text-complete", TextComplete);

注册组件

import TextComplete from "v-textcomplete"

export default {

  components: { TextComplete }

}

简单使用

当然这只是简单的用法，你可以通过 strategies 加入各种匹配，新增各种玩法，如 @ 的匹配、Emoji 比表情的匹配。

简单预览v-textcomplete

最后，欢迎大家来给我提意见，我会不断完善。 https://github.com/jcc/v-textcomplete.

云服务器 GPU云服务器 vue组件 vue组件开发 vue父子组件通讯 vue轮播组件

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/83009.html

Vue.js Guide Essentials-说人话-速记版

摘要：以下内容根据部分速记。同时，需要在父组件标签中添加这个属性，该属性才能传递到子组件内。把父组件传递的数据当做子组件的初始值。以下内容根据Vue.js Guide Essentials部分速记。不含动画/mixin/SSR/路由/状态管理等部分. Introduction 建议阅读原文 https://vuejs.org/v2/guide/in... 什么是Vue 开始声明式...

Sanchi 2019-08-21 18:38 评论0 收藏0
Vue官方推荐的风格指南

摘要：官方推荐的风格指南个人笔记最近刚注意到官方多了一个风格指南的推荐。中始终用组件命名因为官方推荐风格命名，所以能用就用组件命名单词应该是完整的单词完整单词带易读性的好处，和书写麻烦的缺点。 Vue官方推荐的风格指南-个人笔记最近刚注意到vue官方多了一个vue风格指南的推荐。因为业务中一直用的vue，所以梳理学习一下，来增加自己代码的规范性，效果不错也可以安利到团队。文档没有对JS...

null1145 2019-08-22 18:28 评论0 收藏0
Vue_Vue权威指南

摘要：效率不高，很多多余，称之为脏检查。通过索引设置数组元素并触发视图更新。解决闪烁问题自定义指令自定义指令提供一种机制将数据的变化映射为行为。 Vue特性 Vue只是聚焦视图层，是一个构建数据驱动的Web界面的库。 Vue通过简单 API提供高效的数据绑定和灵活的组件系统轻量数据绑定指令插件化架构从传统后台MVC 向REST API + 前端MV*迁移DOM是数据的一种自然映...

SimonMa 2019-08-21 14:31 评论0 收藏0
Vue.js起手式+Vue小作品实战

摘要：本文是小羊根据文档进行解读的第一篇文章，主要内容涵盖的基础部分的知识的，文章顺序基本按照官方文档的顺序，每个知识点现附上代码，然后根据代码给予个人的一些理解，最后还放上在线编辑的代码以供练习和测试之用在最后，我参考上的一篇技博，对进行初入的本文是小羊根据Vue.js文档进行解读的第一篇文章，主要内容涵盖Vue.js的基础部分的知识的，文章顺序基本按照官方文档的顺序，每个知识点现附上代...

CompileYouth 2019-08-21 11:18 评论0 收藏0
Vue.js起手式+Vue小作品实战

摘要：本文是小羊根据文档进行解读的第一篇文章，主要内容涵盖的基础部分的知识的，文章顺序基本按照官方文档的顺序，每个知识点现附上代码，然后根据代码给予个人的一些理解，最后还放上在线编辑的代码以供练习和测试之用在最后，我参考上的一篇技博，对进行初入的本文是小羊根据Vue.js文档进行解读的第一篇文章，主要内容涵盖Vue.js的基础部分的知识的，文章顺序基本按照官方文档的顺序，每个知识点现附上代...

付伦 2019-08-01 16:07 评论0 收藏0