具有简单JavaScript Vue的Vue js未定义

时间:2018-12-27 23:05:53

标签: javascript html vue.js

我试图了解vue的工作原理。为此,我尽可能地简化了它,因此没有webpack,没有CDN或任何其他软件包(除非有必要)。

因此,想到了这一点,但是尝试将简单的变量注入html给出vue是未定义的错误。

* vue.js文件来自npm vue软件包。

<html>
<head>
  <script src="vue.js"></script>

  <script>
  new vue({
    data: 'This must be injected'
  }).$mount('#app');
  </script>

</head>
<body>
  <div id="app">
    <p> {{ data }} </p>
  </div>

  <h1>This is a sample header</h1>
</body>
</html>

3 个答案:

答案 0 :(得分:3)

在准备好Dom之后,您需要加载Vue,以便它可以找到要附加到其上的元素-请勿将其放在头上。也是大写的Vue。并且Data不能只是一个裸属性,它应该是一个返回带有您的属性的对象的函数(也可以是一个对象,but it's not recommended一旦应用开始变大)。

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app">

  <p> {{ data }} </p>

</div>

<h1>This is a sample header</h1>
<script>
  Vue.config.productionTip = false
  new Vue({
    data(){ return {
      data: 'This must be injected'
    }
  }
  }).$mount('#app');
</script>

答案 1 :(得分:1)

您的代码中有一些问题。

  1. vue应该是Vue
  2. 数据应为对象或函数-https://vuejs.org/v2/api/#data

<html>
<head>  
</head>

<body>
  <div id="app">

    <p> {{ myText }} </p>

  </div>

  <h1>This is a sample header</h1>

  <script src="vue.js"></script>

  <script>
    new Vue({
      data: {
        myText: 'This must be injected'
      }
    }).$mount('#app');

  </script>

</body>
</html>

答案 2 :(得分:0)

我认为数据必须包含一个对象,因为它的价值。

import math
import numpy as np
import tensorflow as tf

#Set up data
cells = np.array([[0,1,2,3], [2,3,4], [3,6,5,4,3], [3,9]])
mells = np.array([[0], [2], [3], [9]])
print(cells)

#Write data to tfrecords
writer = tf.python_io.TFRecordWriter('test.tfrecords')
for index in range(mells.shape[0]):
    example = tf.train.Example(features=tf.train.Features(feature={
        'num_value':tf.train.Feature(int64_list=tf.train.Int64List(value=mells[index])),
        'list_value':tf.train.Feature(int64_list=tf.train.Int64List(value=cells[index]))
    }))
    writer.write(example.SerializeToString())
writer.close()

#Open tfrecords using dataset api and batch data
filenames = ["test.tfrecords"]
dataset = tf.data.TFRecordDataset(filenames)
def _parse_function(example_proto):
    keys_to_features = {'num_value':tf.VarLenFeature(tf.int64),
                        'list_value':tf.VarLenFeature(tf.int64)}
    parsed_features = tf.parse_single_example(example_proto, keys_to_features)
    return tf.sparse.to_dense(parsed_features['num_value']), \
           tf.sparse.to_dense(parsed_features['list_value'])
# Parse the record into tensors.
dataset = dataset.map(_parse_function)
# Shuffle the dataset
dataset = dataset.shuffle(buffer_size=1)
# Repeat the input indefinitly
dataset = dataset.repeat()  
# Generate batches
dataset = dataset.padded_batch(3, padded_shapes=([None],[None]), padding_values=(tf.constant(-1, dtype=tf.int64)
                                                 ,tf.constant(-1, dtype=tf.int64)))
# Create a one-shot iterator
iterator = dataset.make_one_shot_iterator()
i, data = iterator.get_next()

#Number or random samples we want to get
size = tf.placeholder(tf.int32)

#Retrieve random samples from the batch
y1 = tf.py_func(lambda x, s: np.random.choice(x.reshape(-1),s), [data[0], size], tf.int64)
y2 = tf.py_func(lambda x, s: np.random.choice(x.reshape(-1),s), [data[1], size], tf.int64)
y3 = tf.py_func(lambda x, s: np.random.choice(x.reshape(-1),s), [data[2], size], tf.int64)

with tf.Session() as sess:
    print(sess.run([y1, y2, y3 ], {size:5}))