2017-07-25 9 views
0

データベースに挿入ボタンを押したときにデータを挿入する必要があり、0.5秒後にdivが消えてしまいます。私はコードが間違っていることを理解しているだけの例です。あなたがそうのようanimation要素を使用する必要がありVuejs divをどのように消すのですか

.fade-enter-active, .fade-leave-active { 
    transition: opacity .5s 
} 
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */  { 
    opacity: 0 
} 
+0

あなたのコードは[** SQLインジェクション**](https://en.wikipedia.org/wiki/SQL_injection)攻撃に対して脆弱です。あなたは[** mysqli **](https://secure.php.net/manual/en/mysqli.prepare.php)または[** PDO **](https ://secure.php.net/manual/en/pdo.prepared-statements.php)ドライバ。 [**この記事**](https://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php)には、いくつかの良い例があります。 –

+0

私は知っているけど、私はどのように私はdivのLOLを失うvueで私は0.5秒後にディアッパーをアペールしたい –

+0

あなたのvueコードはどこですか? – apokryfos

答えて

0

<?php 

    $contents = file_get_contents("foo.txt.001"); 
    $pollfields = explode(',', $contents); 

    foreach ($pollfields as $key) { 

       $sql = "INSERT INTO keywords (`keys`) VALUES ('".$key."')"; 
       if ($conn->query($sql) === TRUE) { 

<div v-if="show" transition="fade" > 
     <div class="alert alert-success" role="alert"> 
     <strong>$key</strong> 
    </div> 
    </div> 
       echo ; 
      } else { 
       echo "Error: " . $sql . "<br>" . $conn->error; 
      } 
    } 

    ?> 
<script> new Vue({ el: '#demo', data: { show: true } }) </script> 

と、このCSS

<transition name="fade"> 
    <div v-if="show"> 
    // content to be animated 
    </div> 
</transition> 

https://jsbin.com/laxoqo/edit?html,js,output

+0

それだけでそこに立って、それは –

+0

はあなたがボタンをクリックしたdisapearないのですか? –

+0

笑、このコードのボタンがありますか? –

0

のjQueryを使用し、それが機能して構築されたいくつかの素晴らしいを持っていますこのため。

$('#id').fadeOut() 

このトリックを行う必要があります。 jquery hereをダウンロードできます。

+0

OPがjQueryに言及していない限り、言及されたライブラリ(VueJSなど)を使用してソリューションを提供するのが一般的ですが、その後はjQuery –

関連する問題