免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
成功使用vue props

父組件:
<template>
  <div class="app-container">
    <el-form ref="form" :model="form" :rules="rules2" label-width="120px">
      <el-form-item label="用戶名" prop="username">
        <el-rate v-model="form.username" show-text></el-rate>
      </el-form-item>
      <el-form-item label="添加時(shí)間" prop="addtime">
        <el-date-picker
          v-model="form.addtime"
          type="datetime"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="選擇日期時(shí)間"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label="數(shù)量" prop="num1">
        <el-input
          type="text"
          oninput="value=value.replace(/[^\d]/g,'')"
          maxlength="9"
          v-model="form.num1"
          placeholder="請(qǐng)輸入數(shù)量"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item>
        <test_props username="sdafsdaaaaaaaaaaaaaaa是" />
      </el-form-item>
      <el-form-item style="text-align:center">
        <el-button type="primary" @click="add();">確定添加</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { add } from "@/api/test";
import test_props from "@/views/form/test_props.vue";
export default {
  components: {
    test_props,
  },
  data() {
    return {
      form: {
        addtime: new Date().toUTCString(),
        num1: 0,
      },
      rules2: {},
    };
  },

  methods: {},
};
</script>

<style scoped>
.line {
  text-align: center;
}
</style>

子組件:
test_props.vue
<template>
  <div class="app-container">
    <el-form ref="form" :model="form" :rules="rules2" label-width="120px">
      <el-form-item label="用戶名" >
         <el-input v-model="username" />
      </el-form-item>
      <el-form-item style="text-align:center">
        <el-button type="primary" @click="add();">確定添加</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { add } from "@/api/test";
export default {
  data() {
    return {
      form: {},
      rules2: {},
    };
  },
  props:{
    username:String,
  },
  methods: {
    add() {
      //先判斷表單是否通過了判斷
      this.$refs.form.validate((valid) => {
        //代表通過驗(yàn)證 ,將參數(shù)傳回后臺(tái)
        if (valid) {
          this.form.username2 = "safdsa33333";
          let params = Object.assign({}, this.form);
          add(params).then((res) => {
            this.$message({
              type: "info",
              message: res.Message,
            });
            if (res.Code == 702) {
              return;
            }
            this.$router.push("/test_list");
          });
        }
      });
    },
  },
};
</script>

<style scoped>
.line {
  text-align: center;
}
</style>

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
Vue.js 使用 ElementUI
ElementUI快速入門
vue踩坑:vue+ element ui 表單驗(yàn)證有值但驗(yàn)證失敗。
vue結(jié)合element_ui,統(tǒng)一驗(yàn)證管理
Vue2和Vue3開發(fā)組件有什么區(qū)別
前端基礎(chǔ):帶你去GitHub查閱 Element UI組件源碼,提高代碼能力
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服