页面历史记录

import React from "react";
import Button from "@fe-plugin/components/lib/h5/cmps/button";


export default function RenderButton(props) {
  const handleClick = () => {
    console.log("处理按钮的点击事件");
  };
  //从外部到element元素数据 填充
  return <Button data={props.element} onClick={handleClick} />;
}

import React from "react";
import {
  withEditableButton,
  withEditableDialog,
DependencyContext } from "@fe-plugin/components/lib/templates/editable-elementcontext";
import { getComponentInfo } from "@fe-plugin/common/lib/component-info";
import { getElementByKey } from "@fe-plugin/common/lib/component-element";
import BaseDialog from "@fe-plugin/components/lib/templates/cmps/dialog";
import BaseButton from "@fe-plugin/components/lib/templates/cmps/button";
import * as ELEMENT_KEY from "constants/element-keys";


// 编辑器舞台编辑组件创建main组件
class InlinePageMain extends React.Component {
  // 获取上下文
  static contextType = DependencyContext;

  // 处理逻辑
  hanldeClick() {
    console.log("点击了按钮");
  }

  render() {
    // 从上上下文获取 配置
    const { config } = this.context;

    // 获取信息，并创建获取element的方法
    const componentInfo = getComponentInfo(config);
    const getElement = (type) => getElementByKey(componentInfo.elements, type);

    //return 获取弹窗元素(
    const dialogElement = getElement(ELEMENT_KEY.POPUP_DIALOG);
 <div>
    // 根据元素配置的key值创建一个可编辑元素
   <Button
 const EditableButton = withEditableDialog(ELEMENT_KEY.Button)((element) => {
      return <BaseButton data={element} style={element.style} />;
    });

    const EditableDialog = withEditableButtongetElement(ELEMENT_KEY.Dialog)((element) => {BTN_A)}
      return (
        <BaseDialog dataonClick={element}>
          <EditableButton />
        </BaseDialog>
      );
    });

    return (
  () => hanldeClickAnswerButton()}
    <Dialog name={ELEMENT_KEY.POPUP_DIALOG}>
        <EditableDialog />
      </Dialog>div>
    );
  }
}

export default InlinePageMain;

import React from "react";
import { DependencyContext Dialog} from "@fe-plugin/components/lib/h5/confirm-dialog/context";
import { getComponentInfo } from "@fe-plugin/common/lib/component-info";
import withPopup{ withEditableComponent } from "@fe-plugin/components/lib/h5templates/witheditable-popupcomponent";
import { getElementByKeywithEditableButton } from "@fe-plugin/commoncomponents/lib/templates/componenteditable-element";
import BaseButton from "@fe-plugin/components/lib/templates/cmps/button";
import * as ELEMENT_KEY from "constants/element-keys";


// 可弹出内置页渲染
function InlineRender(props) {
  创建一个可编辑组件
const EditableComponent = withEditableComponent();

// 获取main组件传入的参数编辑器舞台编辑组件
class Template extends constReact.Component { componentInfo, onClose, getElement }
  //获取上下文
  static contextType = propsDependencyContext;

  const// getElement渲染组件
 = renderCmp(type) => getElementByKey(componentInfo, type);

{
  return (
 //   <Dialog根据元素配置的key值创建一个可编辑元素
    const EditableButton dialog={getElement withEditableButton(ELEMENT_KEY.POPUP_DIALOG)}
Button)((element) => {
      return <BaseButton data={element} imagestyle={getElement(ELEMENT_KEY.IMAGE_B)}
  element.style} />;
    });

    return button={getElement(ELEMENT_KEY.BTN_B)}
      onClick={onClose}
<EditableComponent>
        onClose={onClose}
<div>
          <EditableButton />
        </div>
      </EditableComponent>
    );
  }
}

export default withPopup(InlineRender)Template;

import React from "react";
import { DependencyContext } from "@fe-plugin/components/lib/context";
import { getComponentInfo } from "@fe-plugin/common/lib/component-info";
import { getElementByKeywithEditableComponent } from "@fe-plugin/commoncomponents/lib/templates/editable-component";
import { withEditableButton } from "@fe-plugin/components/lib/templates/editable-element";
import BaseButton from "@fe-plugin/components/lib/templates/cmps/button";
import * as ELEMENT_KEY from "constants/element-keys";

// 创建一个可编辑组件
const EditableComponent = withEditableComponent();

//创建main组件 编辑器舞台编辑组件
class MainTemplate extends React.Component {
  // 获取上下文
  static contextType = DependencyContext;

  // 处理逻辑渲染组件
  hanldeClickrenderCmp() {
    console.log("点击了按钮");
  }

  render() {
    // 从上上下文获取 配置根据元素配置的key值创建一个可编辑元素
    const {EditableButton config }= withEditableButton(ELEMENT_KEY.Button)((element) => this.context;{

    // 获取信息，并创建获取element的方法
 return <BaseButton  const componentInfo = getComponentInfo(config)data={element} style={element.style} />;
    const getElement = (type) => getElementByKey(componentInfo.elements, type)});

    return (
      <div><EditableComponent>
        <Button<div>
          data={getElement(ELEMENT_KEY.BTN_A)}
          onClick={() => hanldeClickAnswerButton()}<EditableButton />
        </>div>
      </div>EditableComponent>
    );
  }
}

export default MainTemplate;

import React from "react";
import {
  withEditableButton,
 DependencyContext withEditableDialog,
} from "@fe-plugin/components/lib/templates/contexteditable-element";
import { getComponentInfo } from "@fe-plugin/common/lib/component-info";
import { withEditableComponentgetElementByKey } from "@fe-plugin/componentscommon/lib/templates/editablecomponent-componentelement";
import { withEditableButtonBaseDialog } from "@fe-plugin/components/lib/templates/editable-elementcmps/dialog";
import BaseButton from "@fe-plugin/components/lib/templates/cmps/button";
import * as ELEMENT_KEY from "constants/element-keys";

// 创建一个可编辑组件
const EditableComponent = withEditableComponent();

// 编辑器舞台编辑组件
class TemplateInlinePage extends React.Component {
  //获取上下文
  static contextType = DependencyContext;

  render() {
    const { config } = this.context;

    // 渲染组件
  renderCmp() { 获取信息，并创建获取element的方法
    const componentInfo = getComponentInfo(config);
    const getElement = (type) => getElementByKey(componentInfo.elements, type);

    // 获取弹窗元素
    const dialogElement = getElement(ELEMENT_KEY.POPUP_DIALOG);

    // 根据元素配置的key值创建一个可编辑元素
    const EditableButton = withEditableButtonwithEditableDialog(ELEMENT_KEY.Button)((element) => {
      return <BaseButton data={element} style={element.style} />;
    });

    const EditableDialog return= withEditableButton(ELEMENT_KEY.Dialog)((element) => {
      <EditableComponent>return (
         <div><BaseDialog data={element}>
          <EditableButton />
        </div>/BaseDialog>
      );
    });

    return (
      <Dialog name={ELEMENT_KEY.POPUP_DIALOG}>
        <EditableDialog />
      </EditableComponent>Dialog>
    );
  }
}

export default TemplateInlinePage;

import React from "react";
import { DependencyContext }Dialog from "@fe-plugin/components/lib/context";
import { getComponentInfo } from "@fe-plugin/common/lib/component-infoh5/confirm-dialog";
import { withEditableComponent }withPopup from "@fe-plugin/components/lib/templatesh5/editablewith-componentpopup";
import { withEditableButtongetElementByKey } from "@fe-plugin/componentscommon/lib/templates/editablecomponent-element";
import BaseButton from "@fe-plugin/components/lib/templates/cmps/button";
import * as ELEMENT_KEY from "constants/element-keys";


// 创建一个可编辑组件可弹出内置页渲染
const EditableComponent = withEditableComponent();

function InlineRender(props) {
  // 编辑器舞台编辑组件获取main组件传入的参数
class Template extends React.Componentconst {
  //获取上下文
  static contextTypecomponentInfo, onClose, getElement } = DependencyContextprops;

  //const 渲染组件
getElement = renderCmp(type) {
    // 根据元素配置的key值创建一个可编辑元素 => getElementByKey(componentInfo, type);

  return (
    <Dialog
    const EditableButton dialog= withEditableButton{getElement(ELEMENT_KEY.Button)((element) => {POPUP_DIALOG)}
      return <BaseButton data={element} style={element.style} />;image={getElement(ELEMENT_KEY.IMAGE_B)}
    });

    return (button={getElement(ELEMENT_KEY.BTN_B)}
      <EditableComponent>onClick={onClose}
        <div>
       onClose={onClose}
   <EditableButton />
        </div>
      </EditableComponent>
    );
  }
}

export default TemplatewithPopup(InlineRender);