使用計算屬性的mailto連結未載入完整的訊息正文

Question

mailto 連結已正確載入收件者和主題，但似乎將電子郵件正文截斷為非常短的長度。我的電子郵件總共有 1500 個字符，因此低於 mailto 限制。該電子郵件的正文似乎被截斷了大約 200 個字元。

我將一個計算屬性附加到 mailto 字串，因為我使用一個名為「marked.js」的套件，它將使用者輸入解析為 markdown/html。

我該如何解決這個問題？我嘗試將新的資料屬性設為“emailFormat”，並在頁面安裝上透過標記的套件執行電子郵件正文，然後設定為資料屬性。我認為這可以解決問題，因為現在我只是將一個字串附加到 mailto 正文，但這並沒有起作用，我仍然得到不完整的電子郵件正文。

接收 api 回應資料並透過標記的套件運行的計算屬性

letterContentToHtml() {
                if (this.formData.letterContent != null) {
                    return marked(this.formData.letterContent); // marked is package to parse user input to markdown/html. 
                }
                else {
                    return null;
                }
            },

顯示內容的模板部分和包含 mailto href 的按鈕

<p class="email-content-data" v-html="letterContentToHtml"></p>
<v-btn class="send-form-btn"
            :disabled="!campaignFormValid || this.emailRecepients == ''"
            elevation="12"
            color="primary"
            target="_blank" 
            :href="mailToString"
            @click="updateCampaignList">
                Send Email!
        </v-btn>

mailto 計算屬性

mailToString() {
                return "mailto:"+this.formData.emailList+"?subject="+this.formData.subject+"&body="+this.emailContent;
            },

Answer 1

在將資料指派給超連結/錨標記的 HREF 屬性之前，您必須對資料進行 URL 編碼：

mailToString()
{
  return "mailto:" + encodeURIComponent(this.formData.emailList) + "?subject=" + encodeURIComponent(this.formData.subject) + "&body=" + encodeURIComponent(this.emailContent);
},

否則可能會幹擾一些保留字符，例如? 或 = 或 & 或某些 Unicode 字符。