改造富文本编辑器wangEditor成react组件 我们知道wangEditor常用的功能是editor实例的 txt.html() 和 txt.text() 方法,尤其是 txt.html() 方法,这是一个类似与jQuery常用的那种get和set一体的方法。
我们怎么把这种传统模式书写的第三方库引入到react项目中,并且方便其它同事使用呢?我们需要做一个react组件,让它来完成wangEditor的“react化”。
对于编辑器转译:使用react hooks优化回调函数在组件间的传递,useState,useReducer? 我们先看一下使用 useState hooks写的todoList组件,里面我们需要层层传递回调函数。
import React, { useState } from "react";
const AddTodoBtn = ({ onAddTodo }) => (
<div className="action-add">
参考教程实现WordPress更新博文通知钩子插件 搞一个更新博客文章的钩子插件,目前的功能是更新自己的PWA缓存版本
<?php
/*
Plugin Name: Daozhao Blog
Description: wordpress操作post的钩子处理插件
Version: 1.1
Author: Shadow Prompt
Author URI: https://www.daozhao.com
LicWordPress钩子Action Hook与Filter Hook WordPress的Action Hook与Filter Hook
WordPress中的 Hook 有两种,分别是 Action Hook 及 Filter Hook ,一开始你可以先把这两种 Hook 看成是一样的东西,只是 Filter 多了一点点不同的特色,接着说明。
Action Hook
WP核心 (或主题、插件)在做它们该做的事时,如果执行到有埋 action hook小改wordpress的get_permalink,支持固定链接设置值和插件获取值不同 因为本站的前端展示放弃使用WordPress博客系统的,而是改用自己的vue服务端渲染了,在保留原来的链接地址(比如 https://www.daozhao.com/8531.html )不变的情html况下,只能更改WordPress里面的固定链接了,只能委屈WordPress使用 https://www.daozhao.com/8531.php 这的链接了。
但是我这样的改造对于WordPrDid you mean to use React.forwardRef()?搞懂react的createRef和forwardRef 最近在使用react过程中发现在使用ref时的一些场景,自己初步感觉react的ref没有vue那么强大。
现在我就简单看下怎么使用ref?
createRef
我们直接看源码
// node_modules/react/umd/react.development.js
// an immutable object with a single mutable value
WordPress博客项目改用react前端展示 之前自己的主打技术栈是vue全家桶,所以将自己的wordpress博客改成了vue版本服务端渲染,现在因为公司需要将我的项目从vue转到react,本人后面可能也就要主打eact技术栈了。
我记得这个网站还是在清明节假期三天改造完成的,当时还写了一篇 《道招网终于完成改版了》 ,想不到这么快又要改了,当然这次我是不准备额外增加功能,主要以迁移技术栈为主,虽然自己最开始学习框架的时候是使用的r富文本编辑器wangEditor多语言、工具栏体验改造 支持多语言
首页wangEditro本身是支持使用多语言的,通过源码可以看到里面有个 replaceLang 方法,虽然这种写法有点非主流,但是是有效的,里面部分地方在支持多语言方面有些遗漏。
以“加粗”功能为例
// 构造函数
function Bold(editor) {
this.editor = editor;
this.title = '加粗' 关注道招网公众帐号

联系博主
