Question

我正在使用vue.js声明html超链接。通过串联说“ baseurl”和“ id”来设置URL。但是，我需要先格式化“ id”。我正在尝试使用vue.js过滤器在与“ baseurl”串联之前处理“ id”。但是，该过滤器适用于整个URL，而不仅仅是我想要的“ id”。

让我们说：

longid = "myprefix.id"

我想获得：

<a href="https://mysite.mydatabase?ID=id">longid</a>

如果我这样做，我会得到的：

<a v-bind:href="'https://mysite.mydatabase?ID='+longid.substring(longid.indexOf('.')+1)">{{ longid }}</a>

但是，我想用vue.js过滤器来做，我更喜欢。我尝试过：

<a v-bind:href="'https://mysite.mydatabase?ID='+longid | shorten">{{ longid }}</a>

过滤器声明为：

filters: {
        shorten: function(myString){
            return myString.substring(myString.lastIndexOf(".")+1)
        }
    },

这适用于整个URL，而不仅仅是“ longid”，所以我终于有了：

href="id"

代替

href="https://mysite.mydatabase?ID=id"

我还尝试将子字符串和过滤器放在括号内

<a v-bind:href="'https://mysite.mydatabase?ID='+ ( longid | shorten )">{{ longid }}</a>

但是随后我得到ReferenceError的抱怨，认为未定义过滤器。

如何使过滤器仅适用于“ longid”，然后与其余URL串联？

Answer 1

您可以定义方法的缩短和用法，例如

<a v-bind:href="`https://mysite.mydatabase?ID=${shorten(longid)}`">{{ longid }}</a>

考虑更改您的shorten函数：

shorten: function(myString){
   return myString.split('.').pop()
}

Answer 2

根据我的理解，您正在尝试使用过滤器作为方法。您可以使用this。$ options.filters.filterName（）实现此目的。对于给定的情况，您应该尝试以下操作：

<a v-bind:href="'https://mysite.mydatabase?ID='+$options.filters.shorten(longid )">{{ longid }}</a>。

供参考的小提琴：https://jsfiddle.net/sharitu/nbm2v1dx/3/

Answer 3

尝试一下：

//mail class file inside app/Mail directory

    <?php

    namespace App\Mail;

    use Illuminate\Bus\Queueable;
    use Illuminate\Mail\Mailable;
    use Illuminate\Queue\SerializesModels;
    use Illuminate\Contracts\Queue\ShouldQueue;

    class SendContact extends Mailable
    {
        use Queueable, SerializesModels;
        public $username, $message;
        /**
         * Create a new message instance.
         *
         * @return void
         */
        public function __construct($username, $message)
        {
            //
            $this->username = $username;
            $this->message= $message;
        }

        /**
         * Build the message.
         *
         * @return $this
         */
        public function build()
        {
            return $this->view('contactform');
        }
    }
//your controller

use Illuminate\Support\Facades\Mail;
use App\Mail\SendContact;

public function sendContactForm($request)
    {
        $this->validate($request, [
            'name' => 'required|string',
            'topic' => 'required|string',
            'email' => 'required|email',
            'message' => 'required|string',
            'captcha' => 'required|captcha',
            'acceptReg' => 'required|integer',
        ]);


        $title = $request->input('topic');
        $txt = nl2br($request->input('message'));
        $userName = $request->input('name');
        $email = $request->input('email');
        $ip = $request->getClientIp();
        $dateTime = date('Y-m-d H:i:s');

        $message = "Masz wiadomość ze strony". env('APP_NAME')."<br/>";
        $message .= "
        <b>Dane wiadomości:</b> $dateTime [$ip]<br/>
        <b>Tytuł wiadomości:</b> $title<br/>
        <b>Imię:</b> $userName<br/>
        <b>Adres email:</b> $email<br/>
        <b>Wiadomość:</b> $txt<br/>";  

         Mail::to($email)->send(new SendContact($userName, $message));
         die('mail sent!');
    }

 //your blade contactform.blade.php
@extends('app.layouts')
@section('content')
                Hello, {{ $username }}<br/>
                Your enquiry has been received<br/>

               <br/>
                <p>{{ $message }}</p>


@endsection

 in your .env file define this
    MAIL_DRIVER=smtp
    MAIL_HOST="mail.example.com" //this should be from your webhost
    MAIL_PORT=465
    MAIL_USERNAME="info@example.com" //this is the email from your domain
    MAIL_PASSWORD="************"  //password of the email
    MAIL_FROM_ADDRESS=info@example.com
    MAIL_FROM_NAME='Enquiry Information'
    MAIL_ENCRYPTION=ssl

您的过滤器功能应如下更改：

     <a v-bind:href="'https://mysite.mydatabase?ID='+longid | shorten(longid)">{{ longid }}</a>

第一个参数是url，第二个参数是longid参数

v-bind：href中的Vue.js过滤器语法

3 个答案: