学习人工智能为啥要掌握高等数学中的线性代数

腾讯 t-design 组件的使用‘

 <div>
    <t-button @click="visible = true">Open Modal</t-button>
    <t-dialog v-model:visible="visible">
      <p>This is a dialog</p>
    </t-dialog>
  </div>

这是官网的d代码 当然 引进去 直接可以使用的

看一下我自己根据这个组件库二次封装的diolag

<template>
  <div>
    <t-dialog
      theme="info"
      :visible="visible"
      :close-btn="true"
      attach="body"
      header="新增"
      width="600px"
      :destroy-on-close="true"
      @close="onCancel"
    >
      <template #body>
        <div style="padding: 30px">
          <t-form ref="form" :rules="FORM_RULES" :data="formData" :colon="true" @submit="onSubmit">
            <t-form-item label="手机号" name="phone">
              <t-input v-model="formData.phone" placeholder="请输入"></t-input>
            </t-form-item>
            <t-form-item label="密码" name="password">
              <t-input v-model="formData.password" placeholder="请输入"></t-input>
            </t-form-item>
            <t-form-item label="学员等级" name="membershipLevel">
              <t-select v-model="formData.membershipLevel">
                <t-option :label="'非VIP'" :value="0" />
                <t-option :label="'VIP'" :value="1" />
                <t-option :label="'高级VIP'" :value="2" />
              </t-select>
            </t-form-item>
            <t-form-item label="授权时间" name="expirationTime">
              <t-date-picker
                :disable-date="{ before: dayjs().add(0, 'day').format() }"
                :style="{ width: '100%' }"
                v-model="formData.expirationTime"
                mode="date"
                clearable
                enable-time-picker
              />
            </t-form-item>
            <t-form-item label="学员状态" name="isEnabled">
              <t-radio-group variant="default-filled" v-model="formData.isEnabled">
                <t-radio-button :value="1">启用</t-radio-button>
                <t-radio-button :value="0">禁用</t-radio-button>
              </t-radio-group>
            </t-form-item>
            <t-form-item>
              <t-space>
                <t-button theme="primary" type="submit" :loading="saveLoading">保存</t-button>
                <t-button theme="default" variant="base" type="reset">重置</t-button>
              </t-space>
            </t-form-item>
          </t-form>
        </div>
      </template>
      <template #footer>
        <div></div>
      </template>
    </t-dialog>
  </div>
</template>

import { login } from '@/api/login';
<script setup lang="ts">
import dayjs from 'dayjs';
import {
  MessagePlugin,
  PageInfo,
  PrimaryTableCol,
  RequestMethodResponse,
  TableRowData,
  UploadFile,
} from 'tdesign-vue-next';
import { computed, onMounted, reactive, ref, watch } from 'vue';

import * as studentApi from '@/api/student';

const props = defineProps({
  visible: {
    type: Boolean,
    required: true,
  },
});
const saveLoading = ref(false);
const FORM_RULES = {
  phone: [{ required: true, message: '手机号必填' }],
  password: [{ required: true, message: '密码必填' }]
};

const formData = reactive({
  phone: null,
  password: null,
  membershipLevel: 0,
  expirationTime: null,
  isEnabled: 1,
});

const emit = defineEmits(['confirm', 'cancel']);

const onSubmit = ({ validateResult, firstError, e }) => {
  e.preventDefault();
  if (validateResult === true) {
    console.log(formData);
    saveLoading.value = true;
    studentApi
      .add({
        phone: formData.phone,
        password: formData.password,
        membershipLevel: formData.membershipLevel,
        expirationTime: formData.expirationTime,
        isEnabled: formData.isEnabled,
      })
      .then(() => {
        emit('confirm');
      })
      .catch((error) => {
        MessagePlugin.warning(error.message);
      })
      .finally(() => {
        saveLoading.value = false;
      });
  } else {
    MessagePlugin.warning(firstError);
  }
};
const onCancel = () => {
  emit('cancel');
};
</script>

<style lang="less" scoped>
:deep(.t-upload__flow-image-flow) {
  width: 100%;
}
:deep(.t-upload__card-item) {
  margin-right: 10px;
}
.footer-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.selected-count {
  display: inline-block;
  margin-left: var(--td-comp-margin-l);
  color: var(--td-text-color-secondary);
  line-height: 32px;
}
.table-container {
  margin-top: var(--td-comp-margin-xxl);
}
.operation-container {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  .expand {
    .t-button__text {
      display: flex;
      align-items: center;
    }
  }
}
</style>

父组件中使用

 <studentEditDialog
      ref="studentEditDialogRef"
      :itemInfo="itemInfo"
      :voteDetailList="voteDetailList"
      :visible="studentEditDialogVisible"
      @cancel="studentEditDialogVisible = false"
      @confirm="studentEditDialogSuccess()"
    >

至于 传什么值 可以在修改了