Wysiwyg编辑器用于组件/ Vuetify

huangapple go评论70阅读模式
英文:

Wysiwyg Editor for components / vuetify

问题

我真的很讨厌UI设计。所以我考虑了建立自己的所见即所得编辑器...只是为了好玩和新挑战。

你们有没有人有这方面的经验,尝试过类似的事情?

提前感谢,
干杯

社区的经验和知识

英文:

I really hate ui designing. So i thought about building my own wysiwyg editor.. Just for fun and a new challenge.

Has anyone of you experience with it and tried something like that?

Thanks in advance,
Cheers

Experience and knowledge of the community

答案1

得分: 1

应该相对简单,使用Vuetify组件。它们已经有很多组件,构成所见即所得编辑器的基本构建模块,例如v-textareav-btn-toggles。实际上,在v-btn-toggle页面上,它们已经有一个简单的所见即所得编辑器示例。

如果你想要更具挑战性的任务,你可以不使用Vuetify,这将迫使你更多地了解如何绑定响应属性并根据这些属性动态样式化文本。Vuetify非常容易使用,所以挑战性不大。

英文:

Should be fairly simple using Vuetify components. They already have a bunch of components that constitute the building blocks for a WYSIWYG, like the v-textarea and the v-btn-toggles. In fact, they already have a simple WYSIWYG example in the v-btn-toggle page.

If you want a harder challenge, you should do it without using Vuetify and that forces you to learn more about how to bind the reactive properties and dynamically style the text based on those properties. Vuetify is very much plug and play so it's not much of a challenge.

答案2

得分: 0

只翻译代码部分:

  • HTML contenteditable 属性可以帮助您渲染修改后的文本。输入字段无法呈现其中的HTML,因此这会很有用。

  • 另一个有用的事情是从 contenteditable div 中获取所选文本。

使用Vue响应性并发挥您的魔力。祝你好运!

英文:

Make it simple and implement only those things what you will actually going to use. Like if you do not want list items then don't implement logic for those. Here is a list i think would help you proceed further:

Use vue reactivity and work on your magic. Good Luck!!

huangapple
  • 本文由 发表于 2023年6月8日 02:36:40
  • 转载请务必保留本文链接:https://go.coder-hub.com/76426178.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定