cloudnote_web/pages/index/document.vue

<template>
    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
       <el-form-item :label="$t('document.form.title')" prop="title">
           <el-col :span="4">
              <el-input v-model="form.title" :placeholder="$t('input_please',{keyword:$t('document.form.title')})"/>
           </el-col>
       </el-form-item>
      <el-form-item :label="$t('document.form.author')" prop="author">
        <el-col :span="4">
          <el-input v-model="form.author" :placeholder="$t('input_please',{keyword:$t('document.form.author')})"/>
        </el-col>
      </el-form-item>
      <el-form-item :label="$t('document.form.keyword')" prop="keyword">
        <el-col :span="4">
          <el-input v-model="form.keyword" :placeholder="$t('input_please',{keyword:$t('document.form.keyword')})"/>
        </el-col>
      </el-form-item>
      <el-form-item :label="$t('document.form.specialty')" prop="specialty">
        <el-col :span="4">
          <el-input v-model="form.specialty" :placeholder="$t('input_please',{keyword:$t('document.form.specialty')})"/>
        </el-col>
      </el-form-item>

    </el-form>
</template>

<script lang="ts">
  import Vue from 'vue'

  export default Vue.extend({
    name: 'document',
    data(){
      return {
        form:{
          title:'',
          author:'',
          keyword:'',
          specialty:''
        },
        rules:{}
      }
    }
  })
</script>