在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入门教程(1) 什么是JS
Jan 31 Javascript
让Firefox支持event对象实现代码
Nov 07 Javascript
jquery里的正则表达式说明
Aug 03 Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 Javascript
你不知道的 javascript【推荐】
Jan 08 Javascript
巧用weui.topTips验证数据的实例
Apr 17 Javascript
jquery animate动画持续运动的实例
Nov 29 jQuery
vue.js使用watch监听路由变化的方法
Jul 08 Javascript
我要点爆”微信小程序云开发之项目建立与我的页面功能实现
May 26 Javascript
vue.js实现左边导航切换右边内容
Oct 21 Javascript
浅谈Vue使用Cascader级联选择器数据回显中的坑
Oct 31 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学习之 循环结构实现代码
2011/06/09 PHP
PHP的反射类ReflectionClass、ReflectionMethod使用实例
2014/08/05 PHP
goto语法在PHP中的使用教程
2020/09/17 PHP
Docker 安装 PHP并与Nginx的部署实例讲解
2021/02/27 PHP
JavaScript脚本性能优化注意事项
2008/11/18 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
《JavaScript高级程序设计》阅读笔记(二) ECMAScript中的原始类型
2012/02/27 Javascript
Javascript中的delete介绍
2012/09/02 Javascript
JavaScript 用cloneNode方法克隆节点的代码
2012/10/15 Javascript
把字符串按照特定的字母顺序进行排序的js代码
2014/01/28 Javascript
jquery插件开发之实现md5插件
2014/03/17 Javascript
jQuery下拉友情链接美化效果代码分享
2015/08/26 Javascript
浅谈Jquery中Ajax异步请求中的async参数的作用
2016/06/06 Javascript
简单实现js浮动框
2016/12/13 Javascript
jQuery模拟窗口抖动效果
2017/03/15 Javascript
推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
2017/04/21 Javascript
Gulp实现静态网页模块化的方法详解
2018/01/09 Javascript
jQuery实现的淡入淡出图片轮播效果示例
2018/08/29 jQuery
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
2019/05/13 Javascript
layui实现显示数据表格、搜索和修改功能示例
2020/06/03 Javascript
Vue v-for中的 input 或 select的值发生改变时触发事件操作
2020/08/31 Javascript
web.py中调用文件夹内模板的方法
2014/08/26 Python
Python中用pycurl监控http响应时间脚本分享
2015/02/02 Python
Python浅拷贝与深拷贝用法实例
2015/05/09 Python
Python 基础教程之闭包的使用方法
2017/09/29 Python
python将秒数转化为时间格式的实例
2018/09/16 Python
python调用外部程序的实操步骤
2019/03/04 Python
学习Django知识点分享
2019/09/11 Python
使用python实现多维数据降维操作
2020/02/24 Python
如何理解python对象
2020/06/21 Python
在C#中如何实现多态
2014/07/02 面试题
2013年办公室秘书的个人自我鉴定
2013/10/24 职场文书
工程部经理岗位职责
2013/12/08 职场文书
家具促销活动方案
2014/02/16 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
十大最强电系宝可梦,阿尔宙斯电系之一,第七被称为雷神
2022/03/18 日漫