Why the php output can not insert into Vue data array

Question

I am learning basic Vue.js, when I fetch data using PHP, why it can not put into the Vue object data array

    data: {
        message: "vue?",
        homeView: true,
        brandView: false,
        flipF: true,
        flipB: false,
        prices:[
             {coffee1:15},{coffee1:12},
            <?php 
                while($row = mysqli_fetch_array($result)){
                echo "{coffee1:".$row['price']."},";
                }
            ?>
        ]
    },

The php part could output {coffee1:20},{coffee1:18}, but they can not be shown on webpage

Lawrence Cherone · Accepted Answer · 2019-06-16 04:41:52Z

1

Ideally, you should fetch from an API which will serve JSON, but for sake of answering you should instead build your array, and then use json_encode().

<?php
$prices = [
 ['coffee1' => 15],
 ['coffee1' => 12]
];

while($row = mysqli_fetch_array($result))
  $prices[] = ['coffee1' => $row['price']];

?>

Now in your vue:

data() {
   return {
       message: "vue?",
       homeView: true,
       brandView: false,
       flipF: true,
       flipB: false,
       prices: <?= json_encode($prices) ?>
   }
},

answered Jun 16, 2019 at 4:41

Lawrence Cherone

46.7k7 gold badges66 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Why the php output can not insert into Vue data array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related