Question

我正在使用简历生成器，并且希望能够保存将表单数据输入到.yml文件中，但我似乎找不到任何文章给我一些线索。我希望单击“提交”按钮后，数据会自动写入.yml文件

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<template>
    <div class="biography">
        <h2>Fill in your education information</h2>
        <label for="degree">Degree</label>
        <input id="degree"  type="text">
        <br/>
        <label for="from">From</label>
        <input id="from" type="date">
        <br/>
        <label for="to">To</label>
        <input id="to"  type="date">
        <br/>
        <button id="submit" type="submit">Submit</button>
    </div>
</template>

<script>
    export default {
        name: "Education"
    }
</script>

<style scoped>
    input {
        margin-left: 100px;
        margin-bottom: 10px;
        border: 2px;
        width: 300px;
        height: 3em;
        display: inline-block;
    }
    button {
        font-size: 16px;
        padding: 10px;
        background-color: #004d4d;
        color: white;
        border-radius: 6px;
    }
    button:active {
        background-color: #00e6e6;
    }
    label {
        position: absolute;
    }
</style>

Answer 1

如果编写将输入值转换为代表有效YAML文本的字符串的函数，则可以使用Blob API将其转换为文件。

作为媒体类型，请使用与您公司使用的其他YAML文件相同的类型（text / yaml，application / yaml，text / vnd.yaml等），因为我们（afaik）还没有YAML的标准类型文件。

要实际保存文件，您需要从该Blob创建一个网址，用户可以单击该网址下载。（在SO或任何JS Blob到URL教程上，请参阅此处的许多其他问题。）

如果您实际上是在向服务器端脚本提交表单，则可能有一堆服务器库可以创建YAML文件，您可以将其作为对表单POST请求的响应而返回。

如何使用Vue JS在提交时将表单数据保存在.yml文件中？

1 个答案: