育才学习网1.如何正确使用Vue.js的组件
定义一个组件
// title.vue
{{title.title}}
<script>
export default {
props: {
title: {
title: ''
}
}
</script>
在另一个组件里用
// index.vue
<script>
import navTitle form 'title.vue'
export default {
el: '#app',
data: {
title: {
title： '标题'
}
},
components: {
navTitle
}
}
</script>
2.如何正确使用Vue.js的组件
使用Vue.js的组件# 下载最新的vue$ npm install vuejs 引用 vue.js开始代码，感受vue强大的双向数据绑定 {{ message }} new Vue({ el: '#app', data: { message: 'Hello Vue.js！' }})实战代码：
3..vue文件怎么写js代码
单个组件里面可以使用 import $ from 'jquery' 引用
当前你得使用npm把jquery 安装了。 把jquery 用export default 导出来（就是在jquery.js的最后一行写上 export default $）， 然后使用import $ from 'jquery的文件地址'
至于 script标签里面怎么写
import $ from 'jquery'
export default {
data: function() {
return {
testData: 1 // 这个对象里面定义所有的变量 这些变量可以 在html直接和dom绑定
}
},
mounted: function() {
// 生命周期函数， 有好几个 执行的顺序都不一样，可以根据场景 选择不同的生命周期函数 这块一般是初始化数据的地方
},
methods： { // 这里写所有的方法， 这些方法可以在 方法内部使用this.方法名调用，也可以在html 中使用@时间名 = ‘函数名（）’调用
init() {
// 实例方法
// 使用this.变量可以访问data中的变量
console.log(this.testData)
}
}
}
转载请注明出处育才学习网 » vue.js组件怎么写