Coder Social home page Coder Social logo

请教一下,如何将从服务器取回的HTML代码,设定到可视化设计界面与代码输入栏显示。 只能通过物理文件设定显示吗? about rxdrag HOT 14 CLOSED

codebdy avatar codebdy commented on July 18, 2024
请教一下,如何将从服务器取回的HTML代码,设定到可视化设计界面与代码输入栏显示。 只能通过物理文件设定显示吗?

from rxdrag.

Comments (14)

codebdy avatar codebdy commented on July 18, 2024

你看一下api目录下的代码,这个是模拟后端接口的文件,现在工具栏里面拖动的东西,相当于是从服务器取的HTML。
如果是绑定后台数据,这部分功能还没有实现,后面我的后端框架完成,会实现这个功能。

from rxdrag.

firebear-ssl avatar firebear-ssl commented on July 18, 2024

好的,多谢,我试一试!

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

好的,这是个半成品,竟然有人在用,好惊喜!

from rxdrag.

firebear-ssl avatar firebear-ssl commented on July 18, 2024

觉得还是很棒的,思路可以的。
HtmlPage.vue的initFrame是初期加载默认的代码,那么我想这块实现加载服务器的代码,如何设定,可以明确给段代码吗?

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

这段代码初始化编辑器内核,并没有加载HTML文件,加载HTML文件的代码在这里:
loadHtmlFile
在initFrame 上面隔着一个函数,这个函数的作用是用axios从服务器读取HTML。
往编辑器内核发送HTML代码是用:this.commandProxy.loadHtml
这个函数有两个参数,第一个参数是HTML代码,第二个参数是节点ID,如果第二个参数为空,表示更换整个文档的HTML。编辑器内核在一个IFrame里面,通讯接口是IFrameCommandProxy。多看看这个文件,就知道是怎么跟内核传递数据了

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

传送的代码不能有body,和css跟跟js片段,默认接收是body内部的内容

from rxdrag.

firebear-ssl avatar firebear-ssl commented on July 18, 2024

多谢,已经解决,您的思路挺清晰的!

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

好的,解决就好,我自己做的能不清楚吗。一个月没碰这个代码了,有些地方有点忘了。

from rxdrag.

firebear-ssl avatar firebear-ssl commented on July 18, 2024

还需要请教个问题,在Shell.vue中如可取得当前当前正在设计的画面的即时HTML代码。

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

Shell.vue是多文档的,rxpage是单文档的。如果你只用一个文件的话,可以试试rxpage。
你要用shell的话,需要从vuex里面取当前活动的文档:this.$store.state.activedFile,通过文档类型判断是js,css还是html:file.fileType === 'page' 这个表示是HTML文件,反之是代码文件

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

this.$store.state.activedFile.fileType === 'page'

from rxdrag.

firebear-ssl avatar firebear-ssl commented on July 18, 2024

// 正在编辑的HTML代码
let htmlCode = this.$store.state.activedFile.code;
目前操作我正在拖拉控件,但点直接获取代码,打印出来的还是初期化的HTML代码,只有点击了看代码按钮后,再进次获取才是最新的代码。不知怎么能通过代理刷新一下,把activeFile刷新最新的代码。

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

调用代理的这个方法:requestHtmlCode 可以获取HTML
监听总线的这个事件,可以拿到代码:
$rxbus.$on('replyHtmlCode', 你的处理函数)

from rxdrag.

codebdy avatar codebdy commented on July 18, 2024

可以参考HTMLPage里面的:onReplyHtmlCode

from rxdrag.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.