vue

Posted 2020-11-20 pygg

v-for循环  后面强烈建议加一个    :key：“index / id......”

一使用vue-cli生成项目步骤：
　　1、安装nodejs
　　node -v
　　npm -v
　　2、Vue CLI需要Node.js 8或更高版本（建议8.10.0以上）
　　执行如下：npm install -g @vue/cli

　　看到了：@vue/[email protected]表示安装成功了
　　或者是：C:UsersAdministrator>vue -V
　　3.0.0-rc.3
　　3、vue create hello-world生成新项目

　　一定要连网，等待它下载完成

　　4.$ cd hello-world
   　　$ npm run serve

　　npm run dev
　　npm start

二  、组件

一个组件的命名首字母必须是大写
        一个组件中的data必须是一个函数
                data(){
                    return {
                      
                    }
                }
        静态资源模块导入方法：
        如果想在assets中引用mp3，不能直接写地址（audio src=“地址”），需要
            import audio1 from "./assets/1.mp3"
            然后在data中 return{
                    audiosrc=audio1
                }
            才能用

创建组件，静态资源导入

在主页中：
import Vheader from “./components/Vheader.vue”
export default中（和data同级）：
components:{
            Vheader:Vheader
        }

这样就可以在标签中用：
<div id="app">
        <Vheader></Vheader>
</div>

组件嵌套

组件的style标签中需要加scoped，表示用自己的样式，避免混乱

三、父组件想子组件传值

　　1.在子组件的props（data同目录）进行验证（验证的是    自定义的属性：数据类型）
　　2.给父组件的子组件标签设置自定义的属性

四、子级往父级传值