PublishArticle.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <div>
  3. <el-row style="position: center">
  4. <h2>发布文章</h2>
  5. <el-form ref="form" :model="form" label-width="60px">
  6. <el-form-item label="标题">
  7. <el-input v-model="form.title" style="width: 70%; padding-right: 2px" />
  8. </el-form-item>
  9. <el-form-item label="分类" style="width: 70%; padding-right: 2px">
  10. <el-input v-model="form.category" />
  11. </el-form-item>
  12. <el-form-item label="内容">
  13. <rich-text @content=processContent style="width: 80%; padding-right: 2px" />
  14. <!-- <mavon-editor v-model="content" style="width: 90%; padding-right: 2px" />-->
  15. </el-form-item>
  16. <el-form-item>
  17. <el-button type="primary" @click="onSubmit">立即投稿</el-button>
  18. <el-button>取消</el-button>
  19. </el-form-item>
  20. </el-form>
  21. </el-row>
  22. </div>
  23. </template>
  24. <script>
  25. import RichText from '@/components/upload/RichText'
  26. export default {
  27. name: 'PublishArticle',
  28. components: { RichText },
  29. data() {
  30. return {
  31. content: '',
  32. form: {
  33. title: '',
  34. category: '',
  35. content: ''
  36. }
  37. }
  38. },
  39. created() {
  40. },
  41. methods: {
  42. processContent(value) {
  43. this.form.content = value
  44. },
  45. onSubmit() {
  46. console.log(this.form)
  47. }
  48. }
  49. }
  50. </script>
  51. <style>
  52. </style>