在vue中获取wangeditor的html和text的操作


Posted in Javascript onOctober 23, 2020

目的:vue 中获取 wangeditor 的 html 和 text。

在vue中获取wangeditor的html和text的操作

补充知识:vue-cli webpack 引入 wangeditor(轻量级富文本框)

1:使用npm下载:

//(注意 wangeditor 全部是小写字母)

npm install wangeditor

2: 直接在项目模板中引用

import E from 'wangeditor'

3:HTML

<div id="editorElem" style="text-align:left"></div>

<button v-on:click="getContent">查看内容</button>

4:js代码

export default {
   name: 'editor',
   data () {
    return {
     editorContent: ''
    }
   },
   methods: {
    getContent: function () {
      alert(this.editorContent)
    }
   },
   mounted() {
    var editor = new E('#editorElem')
    editor.customConfig.onchange = (html) => {
     this.editorContent = html
    }
    editor.create()
   }
  }

5:哈哈 然后就搞定啦 附录 原作者github 地址

https://github.com/wangfupeng1988/wangEditor/blob/master/README.md

以上这篇在vue中获取wangeditor的html和text的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中Array 对象相关的几个方法
Dec 22 Javascript
Jquery选择器 $实现原理
Dec 02 Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
Sep 14 Javascript
js动态移动滚动条至底部示例代码
Apr 24 Javascript
如何用js 实现依赖注入的思想,后端框架思想搬到前端来
Aug 03 Javascript
js图片轮播效果实现代码
Apr 18 Javascript
JS获取及验证开始结束日期的方法
Aug 20 Javascript
vue数据双向绑定原理解析(get &amp; set)
Mar 08 Javascript
详解vue与后端数据交互(ajax):vue-resource
Mar 16 Javascript
ES6实现的遍历目录函数示例
Apr 07 Javascript
vue2+el-menu实现路由跳转及当前项的设置方法实例
Nov 07 Javascript
Servlet返回的数据js解析2种方法
Dec 12 Javascript
jquery实现异步文件上传ajaxfileupload.js
Oct 23 #jQuery
vue项目配置同一局域网可使用ip访问的操作
Oct 23 #Javascript
Vue表单提交点击事件只允许点击一次的实例
Oct 23 #Javascript
利用PHP实现递归删除链表元素的方法示例
Oct 23 #Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 #Javascript
如何通过Proxy实现JSBridge模块化封装
Oct 22 #Javascript
微信小程序canvas动态时钟
Oct 22 #Javascript
You might like
PHP实现图片简单上传
2006/10/09 PHP
Yii使用CLinkPager分页实例详解
2014/07/23 PHP
php简单判断文本编码的方法
2015/07/30 PHP
PHP 接入支付宝即时到账功能
2016/09/18 PHP
Code: write(s,d) 输出连续字符串
2007/08/19 Javascript
javascript自定义函数参数传递为字符串格式
2014/07/29 Javascript
js+css实现tab菜单切换效果的方法
2015/01/20 Javascript
浅谈javascript函数式编程
2015/09/06 Javascript
AngularJS国际化详解及示例代码
2016/08/18 Javascript
angular双向绑定模拟探索
2016/12/26 Javascript
Bootstrap table右键功能实现方法
2017/02/20 Javascript
canvas绘制多边形
2017/02/24 Javascript
Node.js安装配置图文教程
2017/05/10 Javascript
javascript帧动画(实例讲解)
2017/09/02 Javascript
关于微信公众号开发无法支付的问题解决
2018/12/28 Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
2019/03/01 Javascript
vue路由教程之静态路由
2019/09/03 Javascript
es6 super关键字的理解与应用实例分析
2020/02/15 Javascript
vue 手机物理监听键+退出提示代码
2020/09/09 Javascript
[01:01:24]LGD vs Fnatic 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
[01:06] DOTA2英雄背景故事第三期之秩序法则光之守卫
2020/07/07 DOTA
python中函数总结之装饰器闭包详解
2016/06/12 Python
解决安装pycharm后不能执行python脚本的问题
2019/01/19 Python
Python登录系统界面实现详解
2019/06/25 Python
pytorch实现CNN卷积神经网络
2020/02/19 Python
numpy矩阵数值太多不能全部显示的解决
2020/05/14 Python
Django 解决新建表删除后无法重新创建等问题
2020/05/21 Python
ASOS比利时:英国线上零售商及自有品牌
2018/07/29 全球购物
Stella McCartney官网:成衣、包袋、香水、内衣、童装及Adidas系列
2018/12/20 全球购物
路德维希•贝克(LUDWIG BECK)中文官网:德国大型美妆百货
2020/09/19 全球购物
学年末自我鉴定
2014/01/21 职场文书
养生餐厅创业计划书范文
2014/03/26 职场文书
中国梦读书活动总结
2014/07/10 职场文书
优秀共产党员事迹材料
2014/12/18 职场文书
公文写作:教你写“建议书”
2019/05/07 职场文书
发工资啦!教你用Python实现邮箱自动群发工资条
2021/05/10 Python