day03zuoye

最新推荐文章于 2024-03-07 20:56:06 发布

jiayouma123

最新推荐文章于 2024-03-07 20:56:06 发布

阅读量121

点赞数

文章标签：作业

本文链接：https://blog.csdn.net/jiayouma123/article/details/102945330

版权

1、目前我们有一个数组[1,2,3,4,5,6,7]，请使用js获取出所有的奇数并加入到一个新数组中，然后将新数组打印到控制台。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="./js/vue.js"></script>
	</head>
	<body>
	<script> 
		[1,2,3,4,5,6,7].forEach(data => {
				// alert(data);
			});
			// filter返回的是满足条件的新数组
			[1,2,3,4,5,6,7].filter(data => {
			if (data % 2 == 0) {
					return false;
				}
			 
				console.log(data);//在控制台打印
			});
		</script>
	</body>
</html>

2、【改错】请指出下列代码有几处错误：
var conponentTemp = {
template: ‘

’,
}
Vue.component(‘ZUJIAN’, conpomentTemp);
var vm = new Vue([
el: ‘#app’
data: [
msg: ‘vm中的msg’
]
methods() {
m1: function() {
alert(‘m1被调用了’);
}
}
]);
改错后为

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./js/vue.js"></script>
	</head>
	<body>
		<div id="app">
			<zujian :zujianmsg="msg"></zujian>
		</div>
		<script>
		 var zujianTemp = {
			template: '<h2>msg:{{zujianmsg}}</h2>',
			props:['zujianmsg']
			}
		Vue.component('zujian', zujianTemp);
		var vm = new Vue({
			el: '#app',
			data: {
            msg: 'vm中的msg'
			},
		methods: {
       m1: function() {
        alert('m1被调用了');
        }
     }
       });
	</script>	
	</body>
</html>

3、下列代码的执行结果是什么，并说明为什么是这个执行结果。
var ay = [‘asdf’, ‘qwsds’, ‘sdsd’, ‘diss’];
ay.filter(data => {
return data.includes(‘sd’) && data.length == 5;
});
答：代码执行的结果为‘qwsds’，‘qwsds’在ay数组里满足字符串里包含‘sd’并且字符串的长度为5的字符串。
4、创建组件的流程是什么，请写个每个流程的代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <!--总结组件特点：
    1、组件只能应用在vm的视图下
    2、组件有自己独立的data，即<组件名></组件名> <组件名></组件名> 这两次使用组件会产生两个独立的data
    3、组件有自己的html视图代码
    -->
    <!--3、像使用标签一样使用组件即可-->
    <zujian1></zujian1>
    <zujian1></zujian1>
</div>

<script src="js/vue.js"></script>
<script>
    var commonData = {
        count: 0
    };
    /*1、定义组件模板*/
    var zujianTemp = {
        template: '<h2>count:{{count}}<button @click="count++">点我将count+1</button><button @click="zujianm">点我就会调用组件m方法</button></h2>',
        data() {
            return {
                count: 0
            };
        },
        methods: {
            zujianm() {
                alert(this.count);
            }
        }
    }
    /*2、将组件注册到Vue中*/
    Vue.component('zujian1', zujianTemp);

    var vm = new Vue({
        el: '#app',
        data: {
            gushi: '锄禾日当午，汗滴禾下土。谁知盘中餐，粒粒皆辛苦。'
        },
        methods: {
            m() {

            }
        }
    });

</script>
</body>
</html>